Beautiful Components
for Astro
Hybrid-Astro-UI using a hybrid model: zero-JS Astro + progressive enhancement with web components.
pnpm dlx hybrid-astro-ui@latest add button
Why Hybrid Astro UI?
Components designed for developers who value quality, accessibility, and performance.
Fully Accessible
Built with accessibility best practices. Includes keyboard navigation, screen reader support, and proper ARIA attributes.
Customizable
Fully compatible with Tailwind CSS for seamless customization
TypeScript Friendly
Written in TypeScript with complete type support. Enjoy IntelliSense and compile-time validation.
Dark Mode
Built-in support for dark mode. Switch between themes without additional setup.
No Heavy Dependencies
Pure Astro components without large external libraries. Simply copy and paste them into your project.
Optimized
Most components ship with zero client-side JavaScript. When interactivity is needed, it's handled through small, lightweight Web Components.