UI Vault

Vol. 02Open-source UI + the UV API58live snippets

Better interfaces, assembled from open parts.

UI Vault catalogues open-source kits, icons, typefaces, motion and shader libraries. It also ships its own small component library. Every piece on this site is live, documented and free to copy.

Get the API See examples 3D skins Open the Library Python & C++ Showcase Page blocks Read the docs
Resources
0
Categories
0
Live snippets
0
Licence
MIT

§ 00 — The library

87 themes, a thousand pieces, one API.

Modular CSS + JS: load the whole bundle or only the modules you need, then mix 87 themes (data-uv-theme) and 70+ effects (uv-fx-*) on any element. Use uivault.css for buttons, tabs, cards, glass, forms, rings, docks, marquees and backgrounds. Use uivault.js for toasts, modals, a ⌘K palette, confetti, tilt, magnetic hover, count-ups, typewriters, scroll reveals, pinned scroll scenes and synthesized UI sounds.

Quick start Download .zip Read the docs See examples Browse the showcase uivault.css uivault.js 
<!-- that's the whole setup -->
<link rel="stylesheet" href="lib/uivault.css">
<script src="lib/uivault.js" defer></script>

<button class="uv-btn uv-btn--grad"
        data-uv="magnetic ripple"
        data-uv-confetti>Ship it</button>

// or from JS
UV.toast("Saved!", { type: "success" });
UV.cmdk([{ label: "Theme", action: () => UV.theme("toggle") }]);

New — See examples

Seven websites, built to be scrolled.

A rocket launch, a deep-sea dive, a cyberpunk product, a magazine long-read, a coffee roaster, a SaaS page and a 3D camo grind. Each one uses only UI Vault and its scroll API.

See the examples →

§ 01 — Playground

Snippets, ready to paste.

Plain HTML + CSS (and a few lines of JS where needed). Hover, click, play — then hit Copy.

§ 02 — Post-FX Lab

Post-processing, by hand.

A real WebGL post pass: bloom, chromatic aberration, vignette, film grain, scanlines and CRT curvature. Drop in your own image, dial it in, copy the shader.

§ 04 — Built with the vault

Flow, a focus timer.

A real app using the techniques on this page: sliding tabs, a glowing progress ring, tactile buttons, toasts, a mini chart and subtle sound. No frameworks, one folder.

Open Flow
24:59Deep focus

§ 05 — Library

The index, sorted and searchable.

Every link is free to use. Filter by category, search anything, and ★ the ones you love — favorites are saved in your browser.

Snippet