Use Design MD

Récupère les vrais tokens design.md d'une marque Korean et les applique à votre UI

par CaesiumY · CaesiumY/ko-design-md

Testé · Fonctionne ★ 9.2/10

Use Design MD — Récupère les vrais tokens design.md d'une marque Korean et les applique à votre UI

Ce que fait

Compétence consommateur pour le catalogue getdesign.kr : résout une marque Korean nommée par l'utilisateur (Toss, Karrot, Baemin, KRDS) en un slug, récupère son design.md brut et son sidecar de tokens à l'identique via le réseau, puis mappe les couleurs réelles, la typographie, l'espacement et les do's/don'ts sur le système de style du projet actuel. Se déclenche sur 'make this look like Toss', '토스 디자인으로 만들어줘', ou '/use-design-md'. Fonctionne dans n'importe quel dépôt et refuse d'inventer un design.md pour une marque non cataloguée.

Rapport de test

Récupéré l'entrée Toss en direct : elle a renvoyé un design.md sourcé, de qualité spécification, avec des tokens OKLCH exacts (blue-500 oklch(0.624 0.176 254), une échelle de gris complète de 12 étapes teintée de bleu marine froid), un modèle de token à quatre niveaux documenté, la règle 'one primary CTA per screen', trois exceptions de dégradés en liste blanche, et la politique de voix 해요체. Une base de référence de mémoire ne récupère qu'un hex Toss-blue approximatif et manque toute l'échelle et les règles, donc le delta de fidélité est grand et concret. SKILL.md est honnête, avertissant même contre WebFetch car il supprime silencieusement les valeurs exactes des tokens.

Testé le: 2026-07-25 · Claude Code 2.x (agent harness)

Installation

git clone --depth 1 https://github.com/CaesiumY/ko-design-md.git
mkdir -p ~/.claude/skills
cd ko-design-md && cp -r .claude/skills/use-design-md ~/.claude/skills/use-design-md

Commandes et exemples de prompts

  • /use-design-mdRécupère les vrais tokens design.md d'une marque Korean et les applique à votre UI

Les skills se déclenchent sur des demandes en langage courant — aucune commande à retenir. Après installation, des prompts comme ceux-ci l'activent (en anglais) :

  • 토스 디자인 시스템의 실제 색상과 타이포그래피 토큰을 가져와서 우리 UI에 적용해줘
  • 당근마켓 브랜드처럼 보이게 이 페이지 디자인을 design.md 기준으로 바꿔줘
  • KRDS 디자인 가이드에 맞춰서 이 버튼과 카드 컴포넌트 스타일을 전부 수정해줘