ark  by chakra-ui

Headless UI component library for multi-framework design systems

Created 3 years ago
4,755 stars

Top 10.4% on SourcePulse

GitHubView on GitHub
1 Expert Loves This Project
Project Summary

Build scalable design systems with unstyled, accessible UI components. Ark UI provides a framework-agnostic foundation for React, Vue, Solid, and Svelte, enabling developers to create high-quality, accessible web applications with complete styling control and consistent cross-framework behavior.

How It Works

Ark UI is a headless component library built upon Zag.js, a state machine engine. This approach ensures predictable, testable component logic with finite state machines. Components are delivered completely unstyled, granting developers full control over visual presentation using any styling solution like Tailwind CSS or CSS-in-JS. Accessibility is a core tenet, with all components adhering to WCAG standards, including proper ARIA attributes, keyboard navigation, and focus management. The library guarantees identical APIs and behavior across React, Solid, Vue, and Svelte.

Quick Start & Requirements

Installation is framework-specific:

  • React: npm install @ark-ui/react
  • Solid: npm install @ark-ui/solid
  • Vue: npm install @ark-ui/vue
  • Svelte: npm install @ark-ui/svelte No non-default prerequisites are mentioned beyond standard Node.js environments. Comprehensive documentation, guides, and interactive examples are available at ark-ui.com.

Highlighted Details

  • Zero-Styling Freedom: Components are completely unstyled, offering total control over visual presentation with any CSS methodology.
  • Accessibility First: Built-in WCAG compliance, including ARIA attributes, keyboard navigation, focus management, and screen reader announcements.
  • State Machine Architecture: Utilizes Zag.js for type-safe, predictable, and easily testable component states and transitions.
  • Multi-Framework Parity: Delivers a consistent API and behavior across React, Solid, Vue, and Svelte, facilitating cross-framework development.
  • Extensive Component Set: Offers over 45 production-ready components covering layout, navigation, forms, data display, and utilities.

Maintenance & Community

Ark UI is maintained by Christian Schröter, Segun Adebayo, and the Chakra UI team, with development supported by sponsors. Community engagement is facilitated via a Discord server, Twitter presence, and a public roadmap.

Licensing & Compatibility

The project is released under the MIT License, allowing for broad compatibility and commercial use.

Limitations & Caveats

The provided README does not explicitly detail any limitations, alpha status, known bugs, or deprecation warnings.

Health Check
Last Commit

16 hours ago

Responsiveness

Inactive

Pull Requests (30d)
17
Issues (30d)
9
Star History
98 stars in the last 30 days

Explore Similar Projects

Feedback? Help us improve.