Checkout
Card fields, billing flag, and a short note.
01
02
03
04
05
06
07
08
09
10
11
12
2026
2027
2028
Overview
Introduction
Installation
Components
Roadmap
Forms
Angle Slider
Checkbox
Color Picker
Combobox
Date Picker
Editable
Field
Fieldset
File Upload
Input
Input Group
Label
Listbox
Number Field
Password Input
Pin Input
Radio Group
Rating Group
Segment Group
Select
Signature Pad
Slider
Switch
Textarea
Overlays
Alert Dialog
Command
Dialog
Floating Panel
Hover Card
Popover
Sheet
Tooltip
Tour
Navigation
Accordion
Collapsible
Pagination
Separator
Steps
Tabs
Tree View
Feedback
Alert
Progress Circular
Progress Linear
Spinner
Timer
Toast
Actions
Clipboard
Swap
Toggle
Toggle Group
Display
Avatar
Badge
Card
Carousel
Empty
Image Cropper
Item
Kbd
Marquee
Qr Code
Scroll Area
Skeleton
Splitter
Zoom Image
Utilities
Download Trigger
Focus Trap
Format Byte
Format Relative Time
Format Time
Highlight
Locale Provider
Presence
↑↓Navigate↵Open
EscCloseARK CN
Interfaces built on craft, styled like you mean it.
Copy-paste primitives, tokens you control, and docs that live beside the components they describe.
Live surfaces in one bento
One grid of minimal, working samples—checkout patterns, navigation, inputs, motion, and feedback—so you can try the kit without loading the full showcase pages.
Accordion
Stacked disclosures.
Shared spacing and radius tokens.
Optional power without visual noise on first load.
Queries
Command, search, and URL patterns.
12
Compute
Radio choice and stepped numeric value.
Environment
GPUs
Tabs
Segmented surface with shared indicator styling.
Content for the active tab.
Snippet or diff body.
Prop table or defaults.
Range
Dual-thumb slider.
Composer
Prompt shell with a compact footer.
Toggles
Switch, checkbox, and row actions.
Clipboard
Copy a stable URL.
https://ark-cn.vercel.app
Team & wayfinding
Avatars, status, and breadcrumb in one strip.
AK
CN
UI
No team yet
Pagination & chips
Pager plus compact survey pills.
Notes & loading
Collapsible detail and a blocking state.
Collapsible keeps secondary copy out of the default scan path.
Processing…
Motion & hint
Swap icons and a tooltip trigger.
Short helper copy next to interactive controls.
Why ARK CN
Three commitments that keep UI work legible for your team and clear for users.
Accessible by default
Keyboard routes, focus, and ARIA come wired in. You decide hierarchy, rhythm, and how loud the interface should feel.
Primitives in-repo
The shadcn way: copy, adapt, and own the source. No mystery package standing between you and a hotfix.
Docs that ship
Guides and references live beside the UI they describe—fewer mismatches between what you read and what you ship.
From kit to screen, without losing the plot
Keep shared components calm and reusable. Push expressive layout, illustration, and motion to the pages where the story lives.
See how the kit is organized“Ship the behavior layer once. Iterate on the surface until it feels inevitable.”