Skip to Content
Prism UI

Introduction

What Prism is, the problem it solves, and what it deliberately is not.

What Prism is

Prism is a configuration-driven React ecosystem that connects mature, proven libraries, React Hook Form, Zod, and Tailwind CSS, through a consistent, strongly typed, configurable developer experience.

Prism's current product milestone is forms. A form built with Prism is rendered, bound, validated with a real Zod schema, and submitted end to end, with full TypeScript inference that rejects a mismatched field type at compile time rather than at runtime.

Prism's value isn't in reimplementing what React Hook Form, Zod, or your UI library already do well. Its value is in the seams between them: the boilerplate most teams write over and over to wire a validation schema to a form library, a form library to a UI kit, and all of that to a typed, reusable configuration surface. Prism owns the seams. It does not own the engines underneath them.

What Prism is not

  • Not another component library. Prism does not ship a competing Button or Input that tries to out-feature shadcn/ui, Radix, or Material UI. Its own primitives exist to give the form engine something concrete to bind to, and they're yours to replace.
  • Not a black box. Every abstraction Prism introduces preserves direct access to the underlying library's native API. usePrismForm returns the real, complete React Hook Form UseFormReturn, not a narrowed subset.
  • Not a universal form-library abstraction. Prism integrates React Hook Form in the current release. It does not promise to work with Formik, TanStack Form, or any other form library.
  • Not a replacement for Tailwind, Radix, or React Hook Form. Prism is built on these libraries, not instead of them, see Core Principles.

Install it

npm install @prismrepo/core @prismrepo/forms @prismrepo/react @prismrepo/adapter-rhf @prismrepo/adapter-zod react-hook-form zod
npm install -D @prismrepo/cli

See Installation for the full setup, including peer dependency requirements.

Proven against a real application

Beyond the examples in these docs, Prism's repository includes apps/validation/ ("Prism Studio"), a seven-route Next.js admin app with six distinct form pages, direct React Hook Form API access (watch/setValue/reset/getValues/setError), cross-field Zod validation, conditional/dependent fields, and two entirely consumer-defined custom field components (a searchable combobox and a card-grid selector), scaffolded by actually running the real prismrepo CLI. See the repository for the full source.

Where to go next

  • Getting Started, install Prism and build your first form.
  • Core Concepts, the architecture, the registry system, and how configuration-driven design works in practice.
  • Forms, the form engine: defining fields, validation, submission, and custom field components.
  • Integrations, the React Hook Form and Zod adapters in depth.
  • CLI, installing Prism's copy-in primitives and field components into your project.
  • Reference, the complete public API of all six packages.

On this page