Introduction

Akaza UI is a headless component library for Vue. It gives you the interactive behavior, accessibility semantics, and keyboard handling for common UI patterns, without imposing any styles.

You own the markup. You own the styles. Akaza UI handles the hard parts.

Philosophy

Most UI libraries bundle behavior and design together. That's great for getting started, but it creates friction the moment your design deviates from their defaults, you're fighting overrides instead of building.

Akaza UI takes the opposite approach:

• Zero default styles. Components render semantic HTML with no classes, no inline styles. Apply whatever CSS or utility framework you want.
• Vue-native slots API. Every component exposes its state and actions through slots, the idiomatic Vue way. No Radix-style sub-component trees, no .Root, .Trigger, .Content chaining.
• Behavior is the product. Focus management, keyboard navigation, ARIA attributes, open/close state, all handled correctly so you don't have to think about it.
• Composable, not opinionated. Components do one thing well. Combine them however your design requires.

What's included

Akaza UI includes low-level primitives for common interaction patterns:

Design decisions

Slots instead of sub-components

Vue slots inject content and receive state from a parent. Akaza UI uses that native mechanism instead of requiring part components such as <Accordion.Root> and <Accordion.Trigger>.

No visual defaults

Akaza UI keeps dimensions, colors, borders, typography, and spacing in your application. Package CSS contains positioning, visibility, interaction, and transition mechanics.

Built for Vue

Akaza UI uses Vue models, reactivity, scoped slots, and component conventions in its public API.

Why the name "Akaza"?

People occasionally ask about the name. Akaza UI takes its name from the character Akaza in Demon Slayer (created by Koyoharu Gotouge).

It follows a similar philosophy:

• Loyal to principles: Akaza UI focuses on being strictly Vue-native, refusing to compromise its architecture by acting as a ported version of React-based libraries.
• Bare-handed strength: Akaza UI ships completely unstyled, providing pure structural DOM primitives without CSS bloat, relying entirely on raw structural perfection.
• Perfect adaptation: Akaza UI flawlessly reads and reacts to state through Vue’s native reactivity and scoped slots, directly exposing state and control to the developer.
• Mastery of fundamentals: Accessibility is core infrastructure, not an add-on. WAI-ARIA roles, keyboard navigation, and focus management are built flawlessly into the foundation of every primitive.
• Direct execution: Rejecting convoluted, deeply nested sub-component trees, Akaza UI favors flat templates and a single ui prop for immediate, boilerplate-free styling.

"Akaza" and the Demon Slayer universe belong to Koyoharu Gotouge and Shueisha. Akaza UI is an independent open-source project and has no affiliation with them.