Skip to content
Beta · 12 components

Accessible UI components you can drop into any Astro project.

Plain .astro files styled with Tailwind v4. Zag handles keyboard, focus and ARIA without a framework island.

npx eris-ui@latest init

Button

The indicator slides to the selected tab.
Each tab is a plain button with role="tab".
Home and End jump to the first and last tab.

Tabs

Tab
Moves focus
ShiftTab
Moves focus back
Right arrow / Left arrow
Next or previous tab
Esc
Closes the dialog

Kbd

Dialog

Yes. Every component is a plain .astro file with a small script.

The code is copied into your project, so edit the classes freely.

MIT. Use it in personal and commercial projects.

Accordion

Switch

Checkbox

Popover

Tooltip

npx eris-ui@latest init

Snippet

Keyboard and focus from Zag

Zag state machines handle arrow keys, Escape, focus traps and ARIA attributes. Each component follows its WAI-ARIA pattern.

Plain .astro files you own

The CLI copies each component into src/components/ui, so you can edit it freely. The diff command shows what changed upstream since you copied it.

No framework islands

Each component ships one small script that adds behaviour to the server-rendered HTML. The page loads no React, Vue or Svelte runtime.

Works with view transitions

Components start on each page load and clean up before Astro swaps the page, so nothing leaks between pages.

Eris Pro · Coming later

Ready made page sections built from the same components.

Pricing tables, settings pages and dashboards that you add with the same CLI.

Follow on GitHub