GetDesign

Förvandlar vilken live-URL som helst till en grundad 9-sektions design.md – varje hex och typsnitt måste spåras till hämtad CSS.

av MohtashamMurshid · MohtashamMurshid/getdesign

Testad · Fungerar ★ 9.6/10

GetDesign — Förvandlar vilken live-URL som helst till en grundad 9-sektions design.md – varje hex och typsnitt måste spåras till hämtad CSS.

Vad den gör

Hämtar en webbplats HTML och länkade stilmallar (plus en webbläsarskärmdump när tillgänglig), extraherar verkliga färg-/typografi-/avstånd-/skugg-/brytpunkts-tokens och utformar en strikt 9-sektions design.md – vägrar att hitta på något värde som den inte kan spåra till en hämtad CSS-regel eller pixel. Utlöses när en användare klistrar in en URL och ber om ett designsystem, stilguide, varumärkestokens eller att klona en webbplats utseende; exkluderar explicit Figma-exporter och localhost.

Testrapport

Pekade den mot basecamp.com på riktigt: den ogrundade baslinjen gissade självsäkert Inter-typsnitt och en #4285F4-liknande blå på ett 8px-rutnät, medan färdighetens faktiska CSS-hämtning hittade de sanna anpassade 'Graphik'/'Sharpie'-webbtypsnitten, oklch-baserade färger och en em-baserad (inte px) avståndsskala – och den vägrade korrekt att hitta på brytpunkter som de samplade stilmallarna inte innehöll.

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

Installation

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

Kommandon och exempelprompter

  • /getdesignFörvandlar vilken live-URL som helst till en grundad 9-sektions design.md – varje hex och typsnitt måste spåras till hämtad CSS.

Skills triggas av vanliga förfrågningar — inga kommandon att memorera. Efter installationen aktiverar prompter som dessa skillen (på engelska):

  • 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.