Introduction

Keystone UI is a collection of beautifully designed, accessible and composable components for modern Solid applications. Built on top of Keystone Core and styled with Tailwind CSS, it's designed for you to copy, paste and own.

We think accessible, unstyled primitives are the best foundation for modern web applications. Keystone Core handles the behavior layer, and Keystone UI gives those primitives a design system that's ready to shape into your app.

This is the component system we're shaping for serious Solid products: dashboards, internal tools, developer tools, analytics workspaces and other data-dense interfaces where clarity and keyboard behavior matter.

Early Access
Keystone UI is in early development. The component source and Core primitives are still evolving, so expect breaking changes while the project takes shape. It is not recommended for production applications yet.

Core

Keystone UI is built on Keystone Core from the ground up. Core owns the hard primitive behavior: accessibility, keyboard navigation, focus management, dismissal, positioning, form semantics, SSR, hydration and controlled or uncontrolled state.

  • Accessible primitive behavior without forcing a visual language into Core.
  • Product-ready composition patterns for overlays, fields, forms, and data-dense workflows.
  • Thoughtful defaults optimized for modern Solid applications.
  • Consistent design tokens across components, docs, previews, and registry source.

Own your code

Keystone follows the source-owned ethos of shadcn/ui. Readable component files live in your project, where you can adapt them as your product changes. Keystone UI source is distributed through a shadcn-compatible registry, while Keystone Core ships as the npm primitive package.

  • Editable source: components live in your app instead of behind an opaque styled runtime.
  • Endless customization: need to change behavior, markup, or styling? Edit the file.
  • Learn by doing: read the Solid source, see how the pieces are composed, and adapt the pattern to your needs.

Keystone source is meant to be read, reviewed and changed.Components use explicit Solid code, stable data attributes and predictable files. That keeps the system legible as your team adapts it over time.

Get involved

Contributions, bug reports, accessibility notes, tests, examples, and docs improvements are welcome while Keystone is still forming. Start with the current component docs and roadmap, then open an issue or pull request with the behavior, evidence, or source change you want to contribute.

Keystone UI is a new, modern UI component library for SolidJS.

Back to top