Show GN: StyleSeed – AI 코딩 도구에 디자인 감각을 심어주는 오픈소스 (2,200줄 디자인 규칙)

바이브코딩으로 UI를 만들면 "기능은 되는데 디자인이 구린" 문제가 있습니다.

StyleSeed는 AI 코딩 도구(Claude Code 등)에 디자인 규칙을 심어주는 오픈소스입니다.
파일을 프로젝트에 복사하면, AI가 토스 앱 수준의 UI를 만들어냅니다.

포함 내용:

• 2,200줄의 시각 디자인 규칙 60개 (컬러 철학, 타이포 계층, 카드 구조, 금지 패턴 등)
• 47개 React 컴포넌트 (shadcn/ui 기반 31개 + 대시보드 패턴 16개)
• 10개 Claude Code 스킬 (UI 생성, UX 감사, 마이크로카피 생성 등)
• Tailwind CSS v4 테마 (라이트/다크 모드)

awesome-design-md(23K 스타)의 DESIGN.md가 브랜드 토큰을 제공한다면,
StyleSeed는 레이아웃 규칙, UX 가이드, 컴포넌트까지 포함하는 "디자인 브레인"입니다.

첫 번째 시드는 토스 스타일. Apple, Linear, Stripe 시드 추가 예정. MIT 라이선스.

[bitjaru0402]

▎ 업데이트입니다 — 클릭 가능한 라이브 데모를 올렸어요.
▎
▎ 🎬 https://styleseed-demo.vercel.app
▎
▎ 같은 챗 UI를 Toss → Raycast → Arc 세 브랜드로 한 번에 morph 시키는 화면이에요. 색·라운드·모션·그림자·그라데이션이 전부 data-skin 속성 하나로 바뀝니다. 코드 분기 없이 토큰만으로요.
▎
▎ README 상단에 GIF 미리보기 박아뒀습니다: https://github.com/bitjaru/styleseed
▎
▎ 첫 게시 때 의견 주신 분들 감사합니다 🙏

[kurthong]

오픈소스를 통한 도메인 지식의 확장이 아이러니하게도 대AI시대에 빛을 발하는거 같네요 너무 멋진 지식공유 감사합니다!

[aldlfkahs]

공유 감사합니다. 개인 프로젝트 할 때 유용하게 써먹겠네요.

[kaydash]

멋져!