Tactile
Interface pieces that behave like hardware: an odometer that carries, a liquid-damped compass, a pull-cord lamp, engraved plates and a machined footer. Vanilla JS and CSS with React, Vue and Svelte wrappers. MIT.
- Free
- Price
- Oct 16, 2026
- Listed
Overview
Tactile UI is a library of interface pieces that behave like physical hardware: an odometer that carries digits, a liquid-damped compass, a pull-cord lamp, flip-dot displays, engraved client plates and a machined footer. The site lists 37 objects, 55 page sections, 190 kit parts and more than 1,000 ready-made examples.
The core is vanilla JavaScript and CSS, with wrappers for React, Vue and Svelte, and items install through the shadcn CLI or an MCP server. Some objects and blocks are free, while the rest are part of a paid Founder Pass. The docs cover finishes and themes, materials, light and depth, accessibility, motion and how specific objects such as the Odometer and Chladni plate work.
Features
- Objects: Surfaces (pin screen, ferrofluid, Chladni plate), dials, displays, reveals, gauges, a globe, a map, players and a mixer.
- Games: Eleven small games, including Simon, Snake, Reaction Timer and Stack Tower.
- Page sections: Heroes, bento grids, calls to action, client logos, contact, FAQs, features, footers, pricing and 404 pages.
- Free items: The Compass, Odometer, Pull-cord Bulb, Engraved Client Plates, FAQ Index and Machined Footer are marked free.
- Brand tuning: Finishes, themes, materials, color, type and spacing tokens can be adjusted to a brand.
- AI tooling: Docs for using the library with Claude and Cursor, plus shadcn and MCP install paths.
Tech stack
- Vanilla JavaScript and CSS
- React, Vue and Svelte wrappers
Registry
Install via the shadcn CLI registry:
npx shadcn@latest add @tactile/component-name