페이지를 불러오는 중입니다.
UI by eye · DESIGN.md
바이브코딩에서는 직접 CSS를 짤 필요가 없습니다. 결과 화면을 비교해 더 마음에 드는 UI/UX를 고르고, 그 선택을 DESIGN.md로 고정한 뒤 AI에게 맡기면 됩니다. 기준 2026-07.
getdesign.md
유명 사이트 분위기를 DESIGN.md로 정리해 둔 카탈로그. 마음에 드는 톤을 고른 뒤 AI 코딩 도구에 넘기면 됩니다.
카탈로그 열기 →
designmd.ai
커뮤니티 DESIGN.md 라이브러리. 미리보기(라이트/다크)를 보고 골라 프로젝트 루트에 넣고 “@DESIGN.md로 스타일 맞춰”라고 하면 됩니다.
커뮤니티 라이브러리 →
코드가 아니라 화면 인상으로 고릅니다. 더 많은 비교는 파트 페이지에.
같은 ‘일정 관리 앱’ 소개라도, 배치·여백·버튼 수만 달라도 느낌이 갈립니다.
AI 기본 레이아웃
한 메시지 · 한 CTA
에이전트에게 이렇게
히어로는 한 문장 약속 + 보조 한 줄 + 주요 CTA 1개만. 그라데이션 카드 그리드·배지 나열 금지. 여백을 넉넉히.
숫자 카드는 같아도, 밀도·위계·색 사용이 다르면 전문성이 달라 보입니다.
정보 폭격
위계 있는 요약
에이전트에게 이렇게
대시보드는 상단 KPI 최대 4개, 본문은 차트 또는 테이블 중 하나만 크게. 장식용 색 금지, 상태색만.
getdesign.md Bookmarked 순위 위주 (18개). 좌측 마크는 동일 GitHub 아바타. 카드 클릭 → DESIGN.md.
Apple
★ 4.1K프리미엄 여백 · SF Pro · 시네마틱 이미지
제품 히어로, 원페이지 마케팅, ‘고급’ 인상
Claude
★ 1.7K따뜻한 테라코타 · 클린 에디토리얼
AI 제품 랜딩, 문서·채팅 UI, 차분한 신뢰
Airbnb
★ 1.3K코랄 포인트 · 사진 중심 · 둥근 UI
숙박·로컬·커뮤니티 마켓, 여행·생활 서비스
Notion
★ 909따뜻한 미니멀 · 세리프 헤딩 · 소프트 서피스
노트·위키·올인원 워크스페이스
Linear
★ 723극단적 미니멀 · 정밀 · 퍼플 포인트
이슈 트래커, B2B 생산성, 다크 앱 UI
Figma
★ 709멀티컬러 · 밝고 협업 도구다운 톤
협업·크리에이티브 툴, 밝은 SaaS
Cursor
★ 463슬릭 다크 · 그라데이션 포인트 · AI 에디터
개발 도구, AI 코딩 제품, 다크 IDE 감성
Airtable
★ 438컬러풀 · 친근 · 구조화된 데이터
스프레드시트·DB 하이브리드, 업무 툴
Clay
★ 438오가닉 셰이프 · 소프트 그라데이션 · 아트 디렉션
에이전시 포트폴리오, 크리에이티브 랜딩
Spotify
★ 427다크 + 비비드 그린 · 앨범·미디어 그리드
음악·팟캐스트·엔터테인먼트 앱
Cohere
★ 408비비드 그라데이션 · 데이터 대시보드
엔터프라이즈 AI, 분석 대시보드
Cal.com
★ 402뉴트럴 클린 · 개발자 친화 심플
예약·스케줄링, 오픈소스 SaaS
Stripe
★ 380퍼플 그라데이션 · 여백 · 결제·신뢰
결제·가격·B2B 신뢰형 랜딩
Vercel
★ 360흑백 정밀 · Geist · 프론트 배포
개발자 도구, 배포 플랫폼, 흑백 랜딩
Supabase
★ 340다크 에메랄드 · 코드 퍼스트
BaaS·문서·개발자 콘솔
Discord
★ 320딥 인디고 · Blurple · 커뮤니티 채팅
커뮤니티·길드·채팅·팬 플랫폼
Slack
★ 300딥 퍼플 · 크림 라벤더 · 업무 메신저
팀 메신저, B2B 협업, 업무 허브
Nike
★ 280흑백 · 거대 타이포 · 풀블리드 사진
브랜드 스토리, 캠페인, 운동·라이프스타일
더 많은 브랜드 분석: getdesign.md 전체 목록 · designmd.ai Explore
