Skills
.Work. You
Rest

nothing-design-system-skill

Official

Generate industrial Nothing-style UI components

Design & Creative#design system#ui components#swiftui#generate#html css#react tailwind#nothing style
AuthorAradotso
Version1.0.0
Installs0

System Documentation

What problem does it solve?

It solves the problem of producing UI that visually matches Nothing’s distinctive monochrome, typographic, mechanical design language without manually hunting for tokens, spacing rules, and component patterns.

Core Features & Use Cases

  • Nothing design tokens: Provides a monochrome palette, spacing system, typography stack, and interaction timing rules for consistent styling.
  • Reusable component patterns: Generates key UI pieces like buttons, segmented progress bars, cards, tables, and toggles in Nothing’s style.
  • Multi-platform output: Supports HTML/CSS, SwiftUI, and React/Tailwind so you can implement the same design system across targets.

Quick Start

Ask the AI to generate a Nothing-style monochrome dashboard button, segmented progress bar, and status card using HTML/CSS that follows the Nothing three-layer hierarchy.

Dependency Matrix

Required Modules

None required

Components

Standard package

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: nothing-design-system-skill
Download link: https://github.com/Aradotso/design-skills/archive/main.zip#nothing-design-system-skill

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 471,000+ vetted skills library on demand.