New: 98,000+ skills indexed from GitHub repos with 100+ stars · every skill safety-checkedBrowse top skillsTop skills
Esc to closeBrowse all skills
Submit a skillBrowse skills
Submit a skillBrowse skills

Agent skill

UI Craft Minimal

by educlopez in educlopez/ui-craft

Minimal / clean / Linear / Notion / Vercel / whitespace-heavy UIs.

MITAuto-check passed

Install UI Craft Minimal

skills CLI
$ npx skills add educlopez/ui-craft --skill ui-craft-minimal -a claude-code

Project install by default; add -g for ~/.claude/skills/.

GitHub CLI
$ gh skill install educlopez/ui-craft ui-craft-minimal --agent claude-code

Project scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).

Manual copy
$ git clone --depth 1 https://github.com/educlopez/ui-craft.git skills-src && mkdir -p .claude/skills && cp -r skills-src/skills/ui-craft-minimal .claude/skills/ui-craft-minimal && rm -rf skills-src

Use ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.

Claude Code skills documentation · loads skills from .claude/skills/

Facts

Skill name
ui-craft-minimal
GitHub stars
376
Token cost
~1.2k tokens
SKILL.md length
548 words
Files
1
Skills in repo
13
Repo updated
First seen
Licence
MIT

At a glance

Minimal / clean / Linear / Notion / Vercel / whitespace-heavy UIs.

  • Whitespace-heavy
  • SKILL.md covers Knobs (locked), Style anchors, Base rules (inherited) and Style-specific overrides, plus 2 more sections
  • Instructions only: no scripts, shell commands, URLs or credentials in SKILL.md

What it does

UI Craft Minimal is an agent skill from educlopez/ui-craft. Minimal / clean / Linear / Notion / Vercel / whitespace-heavy UIs. Locked knobs: CRAFT=8, MOTION=3, DENSITY=2. Monochrome + one accent, Inter/Geist, hairline borders over shadows. Trigger on: minimal, clean, Linear-like, Notion-like, Vercel-like, whitespace-heavy.

Its SKILL.md is about 1.2k tokens, which your agent loads only when the skill is triggered. It is a single SKILL.md file with no bundled scripts.

It works with Vercel and Notion. The repository describes itself as: Design engineering system for AI coding agents — ship UI with craft-level quality. Install as an agent skill. The licence is MIT.

When your agent uses it

  • Whitespace-heavy

Example prompts

  • “/ui-craft-minimal”

What it can do on your machine

Read from SKILL.md and the folder at commit ceecc8e. It shows what the files ask for, not the result of running them.

  • Tool permissions

    Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.

    From allowed-tools in the SKILL.md frontmatter.

  • Runs code

    No scripts in the folder and no shell commands in SKILL.md.

    From the folder's file list and the shell code blocks in SKILL.md.

  • Network

    No URLs in SKILL.md.

    From URLs in SKILL.md, links to its own repository left out.

  • Credentials

    Names no API keys, tokens, secrets or passwords.

    From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.

Context cost

UI Craft Minimal loads about 1.2k tokens when it runs. Until then it costs about 70 tokens; SKILL.md has 548 words of instructions outside code blocks.

Always · name and description, kept in context so the agent knows when to use it
~70
When it runs · the whole SKILL.md, loaded when a task matches
~1.2k

Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.

Safety

Auto-check passed

The automated check found no risky patterns in SKILL.md.

Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.

SKILL.md

The full file from educlopez/ui-craft at commit ceecc8e, republished under its MIT licence (© educlopez). 548 words, ~1,157 tokens.

Download SKILL.mdSave it as .claude/skills/ui-craft-minimal/SKILL.md (or your agent's skills folder).
name
ui-craft-minimal
description
Minimal / clean / Linear / Notion / Vercel / whitespace-heavy UIs. Locked knobs: CRAFT=8, MOTION=3, DENSITY=2. Monochrome + one accent, Inter/Geist, hairline borders over shadows. Trigger on: minimal, clean, Linear-like, Notion-like, Vercel-like, whitespace-heavy.
argument-hint
[action: build|review|polish] [target]

UI Craft — Minimal

Pre-committed minimal style: editorial clean, Linear / Notion / Vercel. Whitespace is the composition. One accent, hairline borders, almost no motion.

Knobs (locked)

  • CRAFT_LEVEL = 8 — minimal aesthetics only work when executed precisely; Polish Pass is mandatory.
  • MOTION_INTENSITY = 3 — hover + modal enter/exit only. No scroll reveals, no page transitions, no stagger.
  • VISUAL_DENSITY = 2 — whitespace-heavy, 1-2 items per row, generous gutters.

Do not re-ask these in Discovery. Skip straight to accent + font confirmation if ambiguous.

Style anchors

  • Black or near-black type on white or near-white canvas. Monochrome + ONE accent.
  • Inter / Geist for body — never a display font.
  • Section padding 120-200px vertical, 40-80px gutters.
  • Hairline borders 1px solid oklch(92% 0.005 250) in place of shadows.
  • Typography is the hierarchy. No decorative gradients, patterns, or glass.
  • Single-column hero default. Asymmetry via one supporting element, not layout tricks.
  • Motion is punctuation, not spectacle.
  • Every pixel deliberate. When in doubt, cut it.

Base rules (inherited)

All rules in ../ui-craft/SKILL.md apply. This file overrides knob defaults and adds style-specific guidance below. The anti-slop and craft tests still apply in full.

Style-specific overrides

Typography

  • Body: Inter or Geist, 400 weight. UI emphasis: 500. Never 600/700 in body copy.
  • system-ui, -apple-system as fallback stack.
  • Headings: tracking-tight / -0.02em above 24px, 500 or 600 max.
  • text-wrap: balance on headings, text-wrap: pretty on paragraphs.
  • No display serifs. No geometric display sans. No mixing two sans families.

Color

  • Surface: oklch(99% 0 0) (light) / oklch(14% 0.005 250) (dark).
  • Text: oklch(18% 0.01 250) primary, oklch(46% 0.01 250) secondary.
  • Accent reserved for: primary CTA, active nav item, one key metric. That is it.
  • Borders: oklch(92% 0.005 250) light / oklch(24% 0.008 250) dark. No colored borders.

Spacing & layout

  • Section vertical: py-24 md:py-32 lg:py-40 (96 / 128 / 160px) minimum; 200px for hero on large screens.
  • Container: max-w-5xl typical; max-w-3xl for reading content.
  • One accent placement per viewport preferred; two max.
  • No card grids with more than 2 columns on desktop.

Borders & elevation

  • Default chrome = 1px hairline border, no shadow.
  • Elevation only for floating UI (menus, toasts, modals) — single soft ambient shadow, not layered.
  • Radius: 6px inputs, 8px cards, 12px modals. Keep the scale narrow.
Show full SKILL.md (202 more words)Show less

Motion

  • Allowed: hover (opacity / border color, 120-150ms), modal + dialog enter/exit (180-220ms ease-out), focus ring.
  • Forbidden at this intensity: scroll-triggered reveals, stagger, page transitions, parallax, magnetic cursor, entrance choreography.
  • Any animation must honor prefers-reduced-motion.

Composition

  • Hero: left-aligned or centered headline, ONE supporting element (social proof line, screenshot, single chip). No floating badges, orbs, blobs.
  • Features: stacked rows with a single real visual each. No 3-up uniform icon grids even when tempting.
  • Nav: text-only links, current state = accent underline or weight 500. No pill backgrounds.

Reference files to read first

Keep the reading list tight. Load only these from ../ui-craft/references/:

  • layout.md — spacing, hierarchy, composition
  • typography.md — scale, readability, weight
  • color.md — monochrome scales, OKLCH, dark mode
  • accessibility.md — focus, contrast, keyboard

Skip dashboard.md, stack.md, sound.md unless explicitly relevant.

Anti-patterns for THIS style

  • Multiple accent colors. One accent, period.
  • Display serifs, geometric display sans, or mixing two sans families.
  • Decorative gradients, mesh backgrounds, noise overlays, glass panels.
  • Scroll-triggered reveals, stagger, page transitions — even "subtle" ones.
  • Uniform 3-column icon-heading-text feature grids.
  • Colored shadows or glows as affordances.
  • Dense layouts. If density feels right, this is the wrong variant — switch to ui-craft-dense-dashboard.
  • Pill backgrounds on nav links or buttons by default; prefer text + underline.
  • Section padding under 96px on desktop.

© educlopez, MIT. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file

Files

Just SKILL.md in skills/ui-craft-minimal of educlopez/ui-craft.

Open the folder on GitHubat commit ceecc8e

Compare with similar skills

UI Craft Minimal next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.

UI Craft Minimal compared with similar skills
SkillStarsUsed inTokensAuto-checkLicenceRepo updated
UI Craft Minimal this skilleduclopez/ui-craft376—~1.2kAutomated safety check: PassMIT
UI DesignerAFK-surf/OpenBridge430—~4.6kAutomated safety check: PassMIT
Popular Web Designsyc-software/qm15k—~2.9kAutomated safety check: PassMIT
Popular Web DesignsTommy-yw/RunbookHermes5461 repos~2.4kAutomated safety check: PassMIT
Awesome Design Mdinfometa/workbuddyskills348—~2.4kAutomated safety check: NotesNone
Vercel Composition Patternssupabase/supabase111k58 repos~726Automated safety check: PassMIT

Similar skills

  • UI Designer

    AFK-surf/OpenBridge

    Design or restyle user interfaces using vendored DESIGN.md references from popular product and brand-inspired visual systems.

    430 GitHub stars~4.6k tokensUpdated 4 mo ago
    Frontend & DesignAuto-check passed

  • Popular Web Designs

    yc-software/qm

    54 real-world design systems (Stripe, Linear, Vercel, Notion, Apple…) as ready-to-paste HTML/CSS — exact colors, typography, components, and spacing for styling a page after a known brand.

    15k GitHub stars~2.9k tokensUpdated today
    Frontend & DesignAuto-check passed

  • Popular Web Designs

    Tommy-yw/RunbookHermes

    54 production-quality design systems extracted from real websites.

    546 GitHub starsUsed in 1 repo~2.4k tokens
    Frontend & DesignAuto-check passed

  • Awesome Design Md

    infometa/workbuddyskills

    Curated collection of 54 DESIGN.md files extracted from real developer-focused websites (Vercel, Stripe, Linear, Notion, Figma, etc.).

    348 GitHub stars~2.4k tokensUpdated today
    Frontend & DesignAuto-check: notes

  • Vercel Composition Patterns

    supabase/supabase

    Official

    React composition patterns that scale. An agent skill from supabase/supabase.

    111k GitHub starsUsed in 58 repos~726 tokens
    DevelopmentAuto-check passed

  • Agent Browser CLI

    vercel-labs/agent-browser

    Official

    Browser automation CLI for AI agents. Use when the user needs to interact with websites, including navigating pages, filling forms, clicking buttons, taking…

    44k GitHub starsUsed in 24 repos~864 tokens
    Productivity & AutomationAuto-check passed

More from educlopez/ui-craft

All 13 skills in this repo

  • Finalize

    educlopez/ui-craft

    Pre-ship gate — runs detector, verifies brief and tokens, applies the 10-pass finish bar, ranks findings by feedback hierarchy.

    376 GitHub stars~1.9k tokensUpdated 1 mo ago
    Auto-check passed

  • Friction Log

    educlopez/ui-craft

    File contributor or agent papercuts as GitHub issues labeled friction, or investigate those issues as the daily friction-log Cloud Agent.

    376 GitHub stars~1.6k tokensUpdated 1 mo ago
    Auto-check passed

  • Remember

    educlopez/ui-craft

    Record a learned design constraint from a correction into the project brief.

    376 GitHub stars~585 tokensUpdated 1 mo ago
    Auto-check passed

  • Sddesign

    educlopez/ui-craft

    Full spec-driven pipeline — walks brief → tokens → shape (spec) → craft (build) → converge → ship in one guided run.

    376 GitHub stars~1.5k tokensUpdated 1 mo ago
    Auto-check passed

  • Start

    educlopez/ui-craft

    Front door. An agent skill from educlopez/ui-craft.

    376 GitHub stars~1.5k tokensUpdated 1 mo ago
    Auto-check passed

  • Tokens

    educlopez/ui-craft

    Audit or establish the project's 3-layer token spine. An agent skill from educlopez/ui-craft.

    376 GitHub stars~1.4k tokensUpdated 1 mo ago
    Auto-check passed

Works with

Questions about UI Craft Minimal

What does UI Craft Minimal do?

Minimal / clean / Linear / Notion / Vercel / whitespace-heavy UIs. UI Craft Minimal is an agent skill from educlopez/ui-craft. Minimal / clean / Linear / Notion / Vercel / whitespace-heavy UIs.

When should I use UI Craft Minimal?

UI Craft Minimal fits situations like: whitespace-heavy.

How do I install UI Craft Minimal in Claude Code?

Run `npx skills add educlopez/ui-craft --skill ui-craft-minimal -a claude-code`. Or copy the skill folder (skills/ui-craft-minimal in educlopez/ui-craft) into .claude/skills/ui-craft-minimal in your project. Claude Code loads it when a task matches its description.

How do I install UI Craft Minimal in Codex?

Run `npx skills add educlopez/ui-craft --skill ui-craft-minimal -a codex`. Or copy the skill folder (skills/ui-craft-minimal in educlopez/ui-craft) into .agents/skills/ui-craft-minimal in your project. Codex loads it when a task matches its description.

Can I use UI Craft Minimal in Cursor, Gemini CLI or GitHub Copilot?

Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add educlopez/ui-craft --skill ui-craft-minimal -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/ui-craft-minimal, .gemini/skills/ui-craft-minimal, .github/skills/ui-craft-minimal and .opencode/skills/ui-craft-minimal in your project.

What does UI Craft Minimal need to run?

SKILL.md names no scripts, command-line tools or credentials: UI Craft Minimal is instructions for the agent only.

Does UI Craft Minimal access the network?

SKILL.md contains no URLs. Any network use would come from the scripts or tools the agent runs. This is read from the text; nothing was executed.

Is UI Craft Minimal safe to install?

Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.

What licence does UI Craft Minimal use?

UI Craft Minimal is published under the MIT licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.

How many tokens does UI Craft Minimal use?

About 1.2k tokens (SKILL.md is roughly 4.6k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.

What are the alternatives to UI Craft Minimal?

Skills that share tags, products or a category with UI Craft Minimal: UI Designer (AFK-surf/OpenBridge, 430 stars), Popular Web Designs (yc-software/qm, 15k stars), Popular Web Designs (Tommy-yw/RunbookHermes, 546 stars) and Awesome Design Md (infometa/workbuddyskills, 348 stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.

Who maintains UI Craft Minimal?

educlopez (a GitHub user) maintains it in educlopez/ui-craft, which has 376 GitHub stars. The repository holds 13 skills in this directory. The repository was last updated on September 3, 2026.

Source: educlopez/ui-craft on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.