Guides

How to compose, style, animate, and internationalize Akar primitives.

Pick a guide. Composition and styling are the two you will use on every component.

Composition

Use the asChild prop to compose Akar's functionality onto alternative element types or your own Vue components.

Styling

Akar are unstyled—and compatible with any styling solution—giving you complete control over styling.

Animation/Transition

Animate Akar with CSS keyframes, native Vue Transition or JavaScript animation library of your choice.

Controlled State

How to work with controlled vs. uncontrolled state in Akar.

Dates & Times

How to work with dates and times in Akar.

Internationalization (RTL)

Akar support both LTR/RTL directions. Learn more about how to integrate internationalization.

Inject Context

Utilize injectContext to enhance component composition in Akar, enabling powerful and flexible UI development.

Server side rendering

Akar can be rendered on the server.

Virtualization

Learn how to efficiently render large datasets with Akar, powered by @tanstack/virtual.

Migration - Radix Vue to Akar

This guide provides step-by-step instructions for developers transitioning their projects from Radix Vue to Akar.