/ark

A headless library for building reusable, scalable design systems that works for a wide range of JS frameworks.

Primary LanguageTypeScriptMIT LicenseMIT

@ark

CodeCov NPM GitHub stars

Available Components

React Solid Vue Svelte
Accordion 🟢 🟢 🟢 ⚪
Avatar 🟢 🟢 ⚪ ⚪
Carousel 🟢 🟢 🟢 ⚪
Checkbox 🟢 🟢 🟢 ⚪
Color Picker 🟢 🟢 🟢 ⚪
Date Picker 🟢 🟢 ⚪ ⚪
Dialog 🟢 🟢 🟢 ⚪
Combobox / Autocomplete 🟢 🟢 🟢 ⚪
Editable 🟢 🟢 🟢 ⚪
Environment 🟢 🟢 🟢 ⚪
Hover Card 🟢 🟢 🟢 ⚪
Menu 🟢 🟢 🟢 ⚪
Number Input 🟢 🟢 🟢 ⚪
Pagination 🟢 🟢 🟢 ⚪
Pin Input 🟢 🟢 🟢 ⚪
Popover 🟢 🟢 🟢 ⚪
Pressable 🟢 🟢 🟢 ⚪
Radio Group 🟢 🟢 🟢 ⚪
Range Slider 🟢 🟢 🟢 ⚪
Rating 🟢 🟢 🟢 ⚪
Select 🟢 🟢 🟢 ⚪
Segment Group 🟢 🟢 ⚪ ⚪
Slider 🟢 🟢 🟢 ⚪
Splitter 🟢 🟢 🟢 ⚪
Switch 🟢 🟢 ⚪ ⚪
Tabs 🟢 🟢 🟢 ⚪
Tags Input 🟢 🟢 🟢 ⚪
Toast 🟢 🟢 🟢 ⚪
Tooltip 🟢 🟢 🟢 ⚪

Contributing

Preview Components

Although Ark is a headless component library, as a developer you still want to make sure that the components behave correctly. At the time of writing neither Storybook nor Storybook alternatives support all major frontend frameworks.

So instead we are recommending Preview.js, an IDE plugin with support for React, SolidJS, Svelte and Vue. The plugin is available for VSCode and JetBrains based IDEs.