Single-file, zero-dependency UI components for vanilla JavaScript. Drop in one script tag — no build step, no framework. Beautiful by default, automatic light/dark, fully keyboard-accessible, headless when you want.
<script src="https://cdn.jsdelivr.net/gh/vanilla-ui-kit/components/dist/vanilla-ui-kit.js"></script>
<script>
new DatePicker('#date')
Toast.success('Saved')
</script>Every component is one standalone file — use one, some, or the whole family. Together they share one theme engine, one positioning engine, one line of unified theming.
Single, range, multi-pane, presets, min/max, disabled dates. Follows your page's theme on its own.
Stacked notifications with actions, promise tracking, hover-pause, and six positions.
Hover, click, focus or manual triggers, four placements with auto-flip, interactive panels.
Action menus with icons, hints, submenus, typeahead, and one-shot context menus at any coordinates.
Native <dialog> top layer, focus management, and promise-based alert, confirm, and prompt.
Enhance your markup or build from data. Roving tabindex, arrow keys, animated indicator.
The styleable select. Search, multiple with tags, groups — and your native form keeps working.
Ctrl/⌘+K. Fuzzy matching with highlights, groups, recents, and a zero-setup static registry.
Reactive values and errors, async validation, fetch submission with server error mapping, and a silent honeypot built in.
International phone field: SVG flags, searchable country dropdown, as-you-type formatting, validation, E.164 output.
Slide-in panels from any side on the same native-dialog machinery as Modal.
Free-text suggestions from arrays or async sources, race-safe, with match highlighting.
Single and dual-thumb ranges with marks, tooltips, and full keyboard support.
Inline are-you-sure anchored to the button. A promise, not a modal.
Drag-and-drop, paste, image previews, per-file progress with retry.
Thousands grouping while you type, steppers with acceleration, raw values for forms.
Bars, spinners, and shimmering skeleton placeholders that restore what they cover.
Constant-width ellipsis logic, go-to jump, and totals — the data-page workhorse.
Icon, title, description, action — the screen every app forgets to design.
Every component keeps the same promises.
// One call themes the whole family:
VC.config({ theme: 'dark', accent: '#b45309', radius: '10px' })