Nothing Design Skill

Skill by ara.so — Design Skills collection.

A design system skill for Claude Code that generates UI components following Nothing's visual language: monochrome, typographic, industrial. Provides reusable design tokens, component patterns, and multi-platform output (HTML/CSS, SwiftUI, React/Tailwind).

What It Does

Nothing Design Skill codifies Nothing's design principles into a reusable system:

• Three-layer visual hierarchy: Display, body, metadata — strict information architecture
• Monochrome palette: OLED blacks (#000000), pure whites (#FFFFFF), precise grays
• Typography: Space Grotesk (display), Space Mono (monospace), Doto (dot-matrix accents)
• Industrial components: Segmented progress bars, mechanical toggles, instrument-style widgets
• Full dark/light modes: Complete token system with semantic color mapping

Installation

Clone the repository and copy the skill folder to your Claude Code skills directory: