- hero-icon-cards_1.html: hero-icon-cards 변형 (icon → 소제목+불릿 계층) - compare-detail-gradient.html: 하단 2열 비교 블록 (Figma Frame 4 기반) - 오답노트.md: 절대 하지 말아야 하는 실수 목록 - figma_to_html.py: Figma→HTML 변환 스크립트 - static/figma-assets/: Figma export 이미지 (배지, 화살표) - 주의: compare-detail-gradient CSS 폰트 크기가 임의 수정됨 — 원본 복원 필요 Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
51 lines
1.2 KiB
CSS
51 lines
1.2 KiB
CSS
/* Design Agent — 디자인 토큰 */
|
|
/* CLAUDE.md에 정의된 디자인 원칙을 CSS 변수로 구현 */
|
|
|
|
:root {
|
|
/* 색상 */
|
|
--color-primary: #1e293b;
|
|
--color-accent: #2563eb;
|
|
--color-neutral: #64748b;
|
|
--color-bg: #ffffff;
|
|
--color-bg-subtle: #f8fafc;
|
|
--color-border: #e2e8f0;
|
|
--color-danger: #dc2626;
|
|
--color-success: #16a34a;
|
|
--color-text: #1e293b;
|
|
--color-text-secondary: #64748b;
|
|
--color-text-light: #94a3b8;
|
|
|
|
/* 폰트 크기 */
|
|
--font-title: 2rem;
|
|
--font-subtitle: 1.25rem;
|
|
--font-body: 0.95rem;
|
|
--font-caption: 0.8rem;
|
|
--font-small: 0.7rem;
|
|
|
|
/* 폰트 두께 */
|
|
--weight-normal: 400;
|
|
--weight-medium: 500;
|
|
--weight-bold: 700;
|
|
--weight-black: 900;
|
|
|
|
/* 여백 */
|
|
--spacing-page: 40px;
|
|
--spacing-block: 20px;
|
|
--spacing-inner: 16px;
|
|
--spacing-small: 8px;
|
|
|
|
/* Warm 테마 (Figma 2026-04) */
|
|
--color-warm-brown: #5C3714;
|
|
--color-dark-teal: #084C56;
|
|
--color-teal: #227582;
|
|
--color-forest: #548235;
|
|
--color-beige: #E4D9C0;
|
|
--color-warm-yellow: #FAEDCB;
|
|
|
|
/* 기타 */
|
|
--radius: 6px;
|
|
--border-width: 1px;
|
|
--accent-border: 3px;
|
|
--line-height-ko: 1.7;
|
|
}
|