frontend-design-kr

Guide frontend designers to create bold, distinctive interfaces with typography, color, and motion requirements.

Updated Jan 23, 2026

Search Tags:#typography #aesthetics #motion #ui-patterns #color-palette #frontend-design

Ready to run

npx skills add https://github.com/Gdm0714/claude-code-resource --skill frontend-design-kr

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: frontend-design-kr
Source: https://github.com/Gdm0714/claude-code-resource/tree/main/skills/frontend-design-kr
Command: npx skills add https://github.com/Gdm0714/claude-code-resource --skill frontend-design-kr

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

이 스킬은 AI가 생성하는 안전한 디자인 패턴에 국한되지 않고 창의적이고 독특한 프론트엔드 디자인을 가이드합니다. 폰트 선택, 색상 팔레트, 애니메이션 및 배경 처리에서 차별화를 추구하는 디자이너를 돕습니다.

Core Features & Use Cases

창의적 프론트엔드 디자인 원칙: AI 슬롭을 피하고 차별화된 UI를 구성하는 핵심 원칙을 제시합니다.
타이포그래피, 색상, 모션 가이드: 고유하고 강렬한 미학을 달성하기 위한 구체적 지침을 제공합니다.
사용 사례: 랜딩 페이지, 대시보드, 웹 UI 컴포넌트 스타일링에 적용하여 독창적 UI를 구현합니다.

Quick Start

Experiment with bold typography, color, and motion to create a distinctive frontend UI.

Frequently Asked Questions about frontend-design-kr

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

How do I stop generating generic AI-slop frontend UI designs?▼

To avoid AI-slop frontend UI designs, enforce concrete restrictions on typography, color contrast, animation usage, and background layering to ensure a cohesive, differentiated aesthetic rather than safe defaults.

What are the best principles for bold typography and color palettes in web UI?▼

Bold typography and color palettes require strict limitations on font choices and precise color contrast rules to achieve a distinctive aesthetic, moving beyond standard safety-driven design patterns.

How do I apply distinctive motion cues and UI patterns to React components?▼

Applying distinctive motion cues and UI patterns to React components involves enforcing specific animation usage rules that impact user experience and create a unique visual identity.

Can I use these frontend design guidelines for dashboards and landing pages?▼

Yes, these frontend design guidelines scope covers landing pages, dashboards, React components, and general web UI styling where typography, color systems, and motion cues impact user experience.

Why does my current web UI styling lack a unique aesthetic?▼

Web UI styling often lacks a unique aesthetic because it relies on AI-safety-driven design patterns, which can be resolved by enforcing concrete background layering and typography restrictions.