Nothing Design

nothing-design

A skill for generating UI in the Nothing visual language: monochrome, Swiss typography, industrial rigor

SkillLow risk

dominikmartn/nothing-design-skill

Install

git clone https://github.com/dominikmartn/nothing-design-skill.git
cp -r nothing-design-skill/nothing-design ~/.claude/skills/

After restarting Claude Code the skill becomes available.

This is third-party code. Review the repository files before installing.

What it does

The skill gives the agent a Nothing-style design system and activates only on an explicit request. It builds interfaces on a three-layer hierarchy of display, body and metadata, using a Space Grotesk, Space Mono and Doto font stack with full token sets for dark and light themes. Its toolkit includes segmented progress bars, mechanical toggles and instrument-style widgets. Output comes as HTML and CSS, SwiftUI or React with Tailwind. References for tokens, components and platform mapping live in the references folder.

Who it is for. For designers and frontend developers who want a monochrome typographic style in the spirit of Nothing.

Good fit when

  • You want an interface in the monochrome Nothing style
  • You need a strict typographic hierarchy without color
  • You build a dashboard or instrument panel with instrument-style widgets

Not a fit when

  • You need a bright, colorful or illustrative design
  • The task is not about UI but general markup

Example request

Design a profile screen in the Nothing style, dark theme

Limitations

The skill triggers only on an explicit command such as Nothing style or /nothing-design and does not activate itself on generic design tasks. It commits to one visual language, not a universal system for any brand.

How to disable. Remove the nothing-design folder from your agent's skills directory.

Security check

  • The skill is design rules and references only

README in short

The README explains that the author tired of repeating the same Swiss typography and OLED-black rules to the agent and packaged them into a skill. On a Nothing-style command the agent builds an interface on a three-layer hierarchy, a three-font stack, and a full token system for dark and light themes. It includes segmented progress bars, mechanical toggles and instrument-style widgets. SKILL.md and references for tokens, components and platforms live in the skill folder. MIT licensed.

SKILL.md

---
name: nothing-design
description: This skill should be used when the user explicitly says "Nothing style", "Nothing design", "/nothing-design", or directly asks to use/apply the Nothing design system. NEVER trigger automatically for generic UI or design tasks.
version: 3.0.0
allowed-tools: [Read, Write, Edit, Glob, Grep]
---

# Nothing-Inspired UI/UX Design System

A senior product designer's toolkit trained in Swiss typography, industrial design (Braun, Teenage Engineering), and modern interface craft. Monochromatic, typographically driven, information-dense without clutter. Dark and light mode with equal rigor.

FAQ

Does the skill self-activate?

No, only on an explicit Nothing-style request, so it does not interfere with generic tasks.

Which output formats are supported?

HTML and CSS, SwiftUI, and React with Tailwind.

Editors’ pick

Official Claude Code plugin from the Next.js repo: adopting Cache Components and Partial Prefetching, and verifying changes on a running dev server

PluginMedium risk142.4K
Editors’ pick

Official shadcn/ui skill and MCP server: the agent searches registries, adds components via the CLI and follows the library's rules

SkillMedium risk123.8K
Editors’ pick

A frontend design skill with 23 commands, live browser iteration and 61 detector rules for common AI-generated UI tells

SkillHigh risk68.1K
Editors’ pick

Vercel's skills: React and Next.js performance, UI guideline audits, React Native, component composition and deploys

SkillMedium risk31.2K