mcpbeat Sign in

UI Craft Minimal Skill for Cursor

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.

1k tokens
context cost
the whole folder, loaded on every use
1
files
instructions only
0
copies elsewhere
how many repositories repackaged it
237
stars on the repo
on the repository, not the skill itself

Install

one command, takes just this skill from the repository
npx skills add https://github.com/educlopez/ui-craft --skill ui-craft-minimal

The instruction itself

7 sections, as written by the author

<!-- HARNESS MIRROR — do not edit here. Canonical source: skills/ or commands/. After editing source, copy into cli/assets/<harness>/ and repo-root harness mirrors. -->

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.

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.

Other skills for the same job

different authors, same section of the catalogue
DOCX
by anthropics
vendor ×16

Comprehensive document creation, editing, and analysis with support for tracked changes, comments, formatting preservation, and text extraction. When Claude needs to work with professional documents (.docx files) for: (1) Creating new documents, (2) Modifying or editing content, (3) Working with tracked changes, (4) Adding comments, or any other document tasks

7k tokens
PDF
by anthropics
vendor ×16

Comprehensive PDF manipulation toolkit for extracting text and tables, creating new PDFs, merging/splitting documents, and handling forms. When Claude needs to fill in a PDF form or programmatically process, generate, or analyze PDF documents at scale.

13k tokens scripts
PPTX
by JayZeeDesign
×15

Presentation creation, editing, and analysis. When Claude needs to work with presentations (.pptx files) for: (1) Creating new presentations, (2) Modifying or editing content, (3) Working with layouts, (4) Adding comments or speaker notes, or any other presentation tasks

308k tokens scripts
Canvas Design
by anthropics
vendor ×13

Create beautiful visual art in .png and .pdf documents using design philosophy. You should use this skill when the user asks to create a poster, piece of art, design, or other static piece. Create original visual designs, never copying existing artists' work to avoid copyright violations.

1388k tokens
PDF
by anthropics
vendor ×10

Use this skill whenever the user wants to do anything with PDF files. This includes reading or extracting text/tables from PDFs, combining or merging multiple PDFs into one, splitting PDFs apart, rotating pages, adding watermarks, creating new PDFs, filling PDF forms, encrypting/decrypting PDFs, extracting images, and OCR on scanned PDFs to make them searchable. If the user mentions a .pdf file or asks to produce one, use this skill.

15k tokens scripts
DOCX
by w95
×6

Use this skill whenever the user wants to create, read, edit, or manipulate Word documents (.docx files). Triggers include: any mention of 'Word doc', 'word document', '.docx', or requests to produce professional documents with formatting like tables of contents, headings, page numbers, or letterheads. Also use when extracting or reorganizing content from .docx files, inserting or replacing images in documents, performing find-and-replace in Word files, working with tracked changes or comments, or converting content into a polished Word document. If the user asks for a 'report', 'memo', 'letter', 'template', or similar deliverable as a Word or .docx file, use this skill. Do NOT use for PDFs, spreadsheets, Google Docs, or general coding tasks unrelated to document generation.

5k tokens
PPTX
by w95
×4

Use this skill any time a .pptx file is involved in any way — as input, output, or both. This includes: creating slide decks, pitch decks, or presentations; reading, parsing, or extracting text from any .pptx file (even if the extracted content will be used elsewhere, like in an email or summary); editing, modifying, or updating existing presentations; combining or splitting slide files; working with templates, layouts, speaker notes, or comments. Trigger whenever the user mentions \"deck,\" \"slides,\" \"presentation,\" or references a .pptx filename, regardless of what they plan to do with the content afterward. If a .pptx file needs to be opened, created, or touched, use this skill.

2k tokens
Obsidian Markdown
by ZhanlinCui
×3

Create and edit Obsidian Flavored Markdown with wikilinks, embeds, callouts, properties, and other Obsidian-specific syntax. Use when working with .md files in Obsidian, or when the user mentions wikilinks, callouts, frontmatter, tags, embeds, or Obsidian notes.

3k tokens

How to use it

Copy the folder

Take educlopez/ui-craft-minimal from the repository into ~/.claude/skills for personal use, or into .claude/skills inside a project.

Check the name does not clash

The agent identifies a skill by the name field in its header. Two skills with the same name cannot sit side by side — one of them will be ignored.