Claude Code로 웹사이트 만들 때 디자인이 늘 비슷하게 나온다면?
UI 디자인 수준을 높이는 GitHub 오픈소스 10개를 모았습니다.
/
1. Superdesign Skill
AI 에이전트용 UI 디자인 스킬
https://github.com/superdesigndev/superdesign-skill
2. Better Design
디자인 시스템과 MCP 도구
https://github.com/marvkr/better-design
3. Design Taste
AI의 디자인 감각을 개선하는 스킬
https://github.com/madebymustafa/design-taste
4. Canvas UI
WebGL 기반 인터랙티브 효과
https://github.com/DavidHDev/canvas-ui
5. Paper Shaders
움직이는 배경과 시각 효과
https://github.com/paper-design/shaders
6. UI Layouts
웹사이트용 UI 컴포넌트 모음
https://github.com/ui-layouts/uilayouts
7. Hyperiux Components
화려한 인터랙션과 애니메이션
https://github.com/Hyperiux-Immersion-Labs/hyperiux-components
8. Motion Primitives
React용 모션 애니메이션
https://github.com/ibelick/motion-primitives
9. Cursify
마우스 커서를 활용한 인터랙션
https://github.com/ui-layouts/cursify
10. Trickle UI Kit
CSS 기반 텍스트 애니메이션
https://github.com/akaieuan/trickle-UI-kit
모두 Claude 전용 스킬은 아니에요. 디자인 스킬부터 MCP, React 컴포넌트까지 섞여 있습니다.
여러분은 웹사이트를 만들 때 디자인, 애니메이션, 사용자 경험 중 어떤 부분이 가장 어렵나요?
[댓글 @vibe.itji]
/
github.com
GitHub - pbakaus/impeccable: The design language that makes your AI harness better at design.
