큐레이션 · 오픈 · 무료

Luma

소셜 이벤트를 만들고, 호스팅하고, 발견하는 현대적 플랫폼입니다.

eventsrefinedproduct

↓ 디자인 시스템 다운로드 (8 MB)OpenDesign 에서 열기

원본 사이트: https://lu.ma

📦 팩 내용 보기 →

디자인 DNA

이벤트소셜캘린더호스팅소비자

현대적인 소셜 모임을 위한 세련된 디지털 초대장

컬러

#F31A7CAccent

#131517Ink

#64666AInk soft

#F7F8F9BG

#FFFFFFBG soft

#444648Muted

rgba(19, 21, 23, 0.1)Line

장난스러운 3D 이미지와 활기찬 핑크 강조가 돋보이는 밝고 중립적인 캔버스입니다.

타이포그래피

system-ui

display64px · 600
body-lg20px · 400
body16px · 400
caption14px · 400

디스플레이 크기에서 타이트한 음수 자간 · 최적의 성능을 위한 시스템 폰트 스택 · 디스플레이 제목에는 두께 600, 본문에는 400

여백

4px

8px

16px

24px

32px

48px

64px

96px

개방적이고 가벼운 레이아웃을 만들기 위한 풍부한 간격의 일관된 4px 기본 그리드입니다.

표면 (라운드 / 그림자 / 경계선)

sm · 8px

md · 15px

lg · 16px

pill · 100px

0 2px 8px rgba(0,0,0,0.04)

레이아웃

1280container

12columns

24pxgutter

768 / 1024breakpoints

왼쪽에 텍스트, 오른쪽에 큰 3D 일러스트레이션이 있는 2단 히어로 레이아웃입니다.

모션과 인터랙션

220msmicro

400mssmall

800msmedium

cubic-bezier(0.4, 0, 0.2, 1)easing

hover 및 focus 상태에 대한 부드러운 0.3초 트랜지션 · 순차적 요소를 위한 캐스케이딩 애니메이션

0.3초 트랜지션과 함께 배경색 또는 불투명도가 미세하게 변화합니다. · 약간의 스케일 또는 불투명도 변화로 즉각적인 시각적 피드백을 제공합니다.

컴포넌트

button 높은 대비의 알약 형태 CTA(다크 그레이 배경, 흰색 텍스트)로 섬세한 hover 트랜지션이 있습니다.
card 부드럽게 둥근 모서리와 섬세한 테두리 또는 그림자가 있는 컨테이너입니다.
chip 보조 정보를 위한 작은 알약 형태 배지입니다.
input 섬세한 테두리가 있는 깔끔하고 둥근 입력 필드입니다.
hero 대담한 헤드라인과 큰 원형 3D 일러스트레이션이 특징인 분할 레이아웃입니다.

보이스와 금지 목록

톤 환영하며, 격려하고, 자연스러운 어조입니다.
헤드라인 중립적인 색상과 활기찬 색상의 혼합을 사용한 짧고 임팩트 있는 구절입니다.
CTA '첫 이벤트 만들기'와 같이 직접적이고 행동 지향적인 표현입니다.

히어로에 어두운 배경을 사용하지 마세요. 스크린샷은 밝고 가벼운 배경을 보여줍니다.
제목에 세리프 폰트를 사용하지 마세요. 스크린샷은 깔끔하고 기하학적인 산세리프 스택을 보여줍니다.
모든 요소에 날카로운 90도 모서리를 사용하지 마세요. 스크린샷은 8px, 15px, 알약 형태가 혼합되어 있습니다.
무채색 또는 단색 팔레트를 사용하지 마세요. 스크린샷은 활기찬 핑크 강조와 3D 컬러 일러스트레이션을 특징으로 합니다.
히어로 이미지에 표준 직사각형 레이아웃을 사용하지 마세요. 스크린샷은 큰 원형 3D 구성을 보여줍니다.
복잡한 내비게이션 바를 사용하지 마세요. 스크린샷은 미니멀하고 깔끔한 상단 우측 내비게이션을 보여줍니다.
피하기: 지나치게 격식 있거나 기업적인 언어
피하기: 밀도 높은 텍스트 블록
피하기: 복잡한 전문 용어

팩 안의 실제 스크린샷

Luma — 桌面滚动分段（90% viewport 步进，作为视觉证据） — 桌面滚动分段（90% viewport 步进，作为视觉证据）

실제 페이지에서 캡처 · 실 computed styles

System Prompt

Luma는 소셜 이벤트 호스팅을 위한 세련되고 현대적인 플랫폼입니다. 디자인은 밝은 중립적 배경(#F7F8F9)과 깔끔한 시스템 폰트 스택을 사용합니다. 활기찬 핑크 강조(#F31A7C)가 미니멀한 캔버스에 장난스러운 느낌을 더해줍니다. 핵심 주의 사항: 히어로 섹션에 절대 어두운 배경을 사용하지 마세요; 세리프 타이포그래피를 피하세요; 그리고 모든 UI 컴포넌트에 날카롭고 사각형 모서리를 적용하지 마세요. 히어로는 깊이와 시각적 재미를 더해주는 큰 원형 3D 일러스트레이션이 특징이며, 타이포그래피는 대담하고 현대적인 느낌을 만들기 위해 디스플레이 크기에서 타이트한 자간에 의존합니다.

이 감각을 당신의 에이전트에

이 디자인의 기계 판독 가능한 사양——색상·타이포·모션까지——을 그대로 AI 에이전트에 전달하세요.

OpenDesign 스킬 ↗ · 이 팩 (에이전트용) ↗

en · zh-CN · zh-TW · ja · ko