GetDesign

Przekształca dowolny aktywny URL w ugruntowany 9-sekcyjny design.md — każdy hex i czcionka musi pochodzić z pobranego CSS.

Autor: MohtashamMurshid · MohtashamMurshid/getdesign

Testowano · Działa ★ 9.6/10

GetDesign — Przekształca dowolny aktywny URL w ugruntowany 9-sekcyjny design.md — każdy hex i czcionka musi pochodzić z pobranego CSS.

Co robi ten skill

Pobiera HTML witryny i połączone arkusze stylów (plus a browser screenshot when available), extracts real color/typography/spacing/shadow/breakpoint tokens, and drafts a strict 9-section design.md — refusing to invent any value it can't trace to a fetched CSS rule or pixel. Uruchamia się, gdy użytkownik wkleja URL i prosi o design system, style guide, brand tokens, or to clone a site's look; explicitly excludes Figma exports and localhost.

Raport z testu

Pointed it at basecamp.com for real: the ungrounded baseline confidently guessed Inter font and a #4285F4-ish blue on an 8px grid, while the skill's actual CSS fetch turned up the true custom 'Graphik'/'Sharpie' webfonts, oklch-based colors, and an em-based (not px) spacing scale — and it correctly refused to invent breakpoints the sampled stylesheets didn't contain.

Testowano: 2026-07-14 · Claude Code 2.x (agent harness)

Instalacja

git clone https://github.com/MohtashamMurshid/getdesign
cd getdesign
mkdir -p ~/.claude/skills
cp -r skills/getdesign ~/.claude/skills/getdesign

Komendy i przykładowe prompty

  • /getdesignPrzekształca dowolny aktywny URL w ugruntowany 9-sekcyjny design.md — każdy hex i czcionka musi pochodzić z pobranego CSS.

Skille uruchamiają się na zwykłe polecenia — bez komend do zapamiętania. Po instalacji aktywują go prompty takie jak te (po angielsku):

  • Here's https://stripe.com, generate a design.md of their tokens.
  • Extract the brand colors and typography from https://linear.app.
  • Clone the visual style of this site into a grounded style guide.