---
title: "Introduction"
description: "Unstyled, accessible Vue primitives for building design systems and web apps."
canonical_url: "https://vinicunca.dev/akar/overview"
---
# Introduction

> Unstyled, accessible Vue primitives for building design systems and web apps.

Akar is an open-source library of unstyled, accessible Vue primitives. Use the parts as the foundation of a design system, or adopt them one component at a time.

It started as a fork of [Reka UI](https://reka-ui.com) (itself descended from [Radix Vue](https://www.radix-vue.com/)) and is published as the `akar` package. Component names match Reka's (`AccordionRoot`, `DialogTrigger`, no prefix). Style them with whatever CSS you already use.

## Why a fork?

Akar is the foundation of [Pohon UI](https://vinicunca.dev/pohon/getting-started). Owning the primitives lets the Vinicunca ecosystem move at its own pace:

- **Ship fixes when Pohon needs them.** Accessibility and behavior fixes land in Akar and release right away, without waiting on an upstream review cycle.
- **Add primitives Pohon builds on.** Akar includes parts such as [Field](https://vinicunca.dev/akar/components/field), [Form](https://vinicunca.dev/akar/components/form), [Tag Group](https://vinicunca.dev/akar/components/tag-group), and a [toast](https://vinicunca.dev/akar/components/toast) manager.
- **Share one toolchain.** Akar uses the same utilities ([Perkakas](https://github.com/vinicunca/perkakas)), release workflow, and docs as the rest of Vinicunca, so versions stay in step.

The API stays close to Reka's on purpose. Moving from `reka-ui` or `radix-vue` is mostly an import swap; see the [migration guide](https://vinicunca.dev/akar/guides/migration).

## Principles

### Accessibility first

Components follow [WAI-ARIA design patterns](https://www.w3.org/WAI/ARIA/apg/). Akar handles aria attributes, keyboard navigation, and focus management so you can concentrate on layout and visuals.

### Unstyled and open

Nothing ships with opinions about color, spacing, or typography. Wrap, extend, or restyle every part. See the [styling](https://vinicunca.dev/akar/guides/styling) and [composition](https://vinicunca.dev/akar/guides/composition) guides.

### Controlled or uncontrolled

Primitives work uncontrolled out of the box (`defaultValue`) and accept `v-model` when you need to own the state. See [controlled state](https://vinicunca.dev/akar/guides/controlled-state).

### Predictable API

Every part that renders a DOM node accepts `as` / `asChild`. The library is fully typed and tree-shaken: unused components do not land in the bundle.

## Start here

[**Getting started**](https://vinicunca.dev/akar/overview/getting-started)

Install Akar and assemble a Popover in a few minutes.

[**Installation**](https://vinicunca.dev/akar/overview/installation)

Package install, the Nuxt module, and the unplugin resolver.

[**Components**](https://vinicunca.dev/akar/components)

Sixty primitives covering overlays, forms, dates, menus, and more.

[**Guides**](https://vinicunca.dev/akar/guides)

Composition, styling, animation, dates, i18n, SSR, and virtualization.

## Credits

Akar is a fork of [Reka UI](https://reka-ui.com). Reka UI is MIT-licensed.

Further upstream inspiration:

- [Radix UI](https://www.radix-ui.com)
- [React Aria](https://react-spectrum.adobe.com/react-aria)
- [Floating UI](https://floating-ui.com)
- [VueUse](https://vueuse.org)
- [Headless UI](https://headlessui.com)
- [Ariakit](https://ariakit.org)

---

- [GitHub](https://github.com/vinicunca/akar)
- [npm](https://www.npmjs.com/package/akar)


## Sitemap

See the full [sitemap](https://vinicunca.dev/sitemap.md) for all pages.