Individual skill

dimensional-drawing

Make an Apple-style monochrome dimensional drawing of a UI component or physical product — title-block summary plus one dense drawing sheet with variable-based dimensions. Use when asked for an anatomy, spec sheet, redline or dimensional drawing of a component.

skills/dimensional-drawing/SKILL.md

Read pinned source

Source commit 5c457437c8c83524308aad3b7443e81adcc13153

What was checked

Matches the observed repository HEAD: Yes
Scanner rules are current: No
Repository scan complete: No
Skill scan complete: No
Observed behavior: Not checked yet
Last checked: Nov 3, 2026

These are observations at the recorded commit, not a guarantee of safety. Review the source before running it.

Install this skill

Choose an agent in your Stack or copy a command below. Commands fetch the pinned commit and copy only this skill directory. Existing destinations are refused. Copying a command does not install anything.

An install command is unavailable: current rules, complete repository and skill scans, an eligible behavior level and a permitted license are required.

Repository context

Repository stars (not skill ratings): 1,958
Repository last updated: Oct 24, 2026
License: MIT

Observed agent integration: No specific integration evidence. Standard SKILL.md installation does not imply verified compatibility.

skills Repository topic
ui Repository topic
design Derived category
design-interface Derived category

Files and excerpt

File metadata and permitted, redacted excerpts come from the recorded scan. Source links are pinned to that commit.

Browse files

SKILL.mdcore · 8,684 bytes
SKILL.mdcore · 8,684 bytes
examples/card-sheet.htmlasset · 23,067 bytes
examples/dialog-sheet.htmlasset · 25,651 bytes

Read excerpt


# Dimensional drawing

Draw one subject the way Apple's accessory dimensional drawings do (developer.apple.com/accessories/dimensional-drawings): everything on one sheet, notes top-left, views spread across the sheet with smaller detail views, tables beside the views that use them. Output is one self-contained HTML file (on claude.ai, publish it as an Artifact). Worked examples: `examples/dialog-sheet.html` and `examples/card-sheet.html` next to this file — copy their drawing kit instead of starting from zero.

## House rules

1. **Monochrome.** Black line on white paper, grays only. No accent color anywhere. Tell things apart by line weight, dash pattern, hatch and light gray fill. Single light theme by design (`color-scheme: light`, every color explicit).
2. **Architecture, not content.** For UI, draw slots, never real copy: lead box with an X, `TITLE SLOT · FLEX`, `TRAIL` / `ACTION` (hug), `CONTENT SLOT · FILL`, `META SLOT · FLEX · WRAPS`, `LABEL SLOT`, `VALUE SLOT`. No text-width dimensions. Size words: HUG (sized by content), FLEX (takes remaining space), FILL (parent width).
3. **Variables, not numbers.** Every dimension on the drawing is a code; tables give code, variable name, value. Derived values are formulas with the result: `H1 header-min = 2·S1+H3 = 64`, `R2 r-inner = R1−B−S6 = 11`, `E1 = BL+SP−Y`, `E2 = BL+SP`, `E3 = BL+SP+Y`.
4. **Unbranded.** No product or company names, logos or wordmarks in the drawing, title block or footer unless the user asks. Use neutral names (`UI-CARD-001`, "UI component reference").
5. **Never invent values.** Anything not in the source is `[TBD]` (e.g. viewport margin, overflow behavior, unpublished physical dims) and is drawn as a proportional schematic.

## Code system