Tactile Design

Tactile, layered, quiet product UI with rings, crisp drops and pressable controls in light and dark

About

A design-engineering skill from Kosta, lead designer at Steel, that teaches a coding agent how to build and review tactile, layered, quiet product interfaces and the decisions behind them. Controls look like objects: white buttons with a 1px ring and a crisp drop that squeeze to 97% when pressed, fields that sink in as wells, and one solid black primary action. Every surface takes its fill, edge and drop from the ground it sits on, so controls read equally pressable on a page, card, table row or sheet, with elevation designed separately for light and dark mode. It covers a decision order (hierarchy first, then data, placement, components, surfaces, type, colour, motion and phone), buttons and controls, surfaces and shadows, layout, motion with exact curves and durations, mobile touch and sheet physics, and a role-based token system with a template for remapping to any typeface and brand colours. Distilled from hundreds of rounds of pixel-level review on a production dashboard.

Install

Works with Claude Code, Cursor, Codex, OpenCode

Access

Low

What this skill's own files let it touch on your machine and accounts. Access isn't a verdict: check the publisher and the security audits too.

No bundled scripts
No shell commands
Writes files in your project
No network access
No credentials needed

Plain Markdown only: a SKILL.md and seven reference files (tokens, buttons and controls, surfaces, layout, motion, mobile, decisions). No scripts, no network calls and no credentials. The agent only edits your own UI code when you ask it to build or restyle something.

Reviewed from source on Nov 3, 2026. Read the files yourself before installing.