큐레이션 · 오픈 · 무료

Relume

Relume은 마케팅 웹사이트를 더 빠르게 구축하기 위한 AI 기반 디자인 및 개발 도구입니다.

01

디자인 DNA

AI 생성과 인간 큐레이션을 결합하는 웹 디자인을 위한 크리에이티브 코 파일럿입니다.

02

컬러

중립적이고 따뜻한 그레이 기반은 깔끔한 캔버스를 제공하여, 선명한 퍼플 악센트와 어두운 텍스트가 시선을 집중시킬 수 있게 합니다.

03

타이포그래피

humanist-sans · monospace

• display80px · 500
• h240px · 500
• body-lg19px · 400
• body16px · 400
• caption14px · 400

큰 디스플레이 제목에는 타이트한 트래킹을 적용합니다. · 모든 본문 텍스트에는 표준 400 웨이트를 사용합니다.

04

여백

4px의 일관된 배수를 사용하여 레이아웃 전반에 걸쳐 구조적이고 예측 가능한 리듬을 만듭니다.

05

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

1px solid rgba(22,22,22,0.1)

rgba(0, 0, 0, 0.04) 0px 1px 2px 0px · rgba(0, 0, 0, 0.08) 0px 1px 3px 0px · rgba(0, 0, 0, 0.08) 0px 8px 10px -4px

06

레이아웃

넉넉한 여백과 히어로 영역의 플로팅 UI 요소가 있는 중앙 정렬 칼럼 레이아웃입니다.

07

모션과 인터랙션

hover 시 부드러운 opacity 및 transform 전환. · 장식적 UI 요소를 위한 플로팅 애니메이션. · 뷰포트 진입 시 가속화된 레이아웃 전환.

카드와 버튼에 미세한 배경색 변화와 약간의 수직 상승 효과입니다. · 배경 변경이나 scale 변환을 통한 즉각적인 시각적 피드백입니다.

08

컴포넌트

• button 흰색 텍스트와 퍼플 아웃라인 고스트 변형이 있는 어두운 채우기 프라이머리 버튼입니다.
• card 부드러운 그림자와 둥근 모서리가 있는 흰색 또는 밝은 회색 카드입니다.
• chip 사회적 증명 및 내비게이션 라벨용의 작은, 둥근 필 뱃지입니다.
• input 그라디언트 테두리와 내부에 채워진 액션 버튼이 있는 크고 눈에 띄는 입력 필드입니다.
• hero 밝은 배경 위에 중앙 정렬된 거대한 타이포그래피와 양쪽으로 둘러싸인 플로팅 인터랙티브 UI 카드입니다.

09

보이스와 금지 목록

• 톤 자신감을 주고, 전문적이며, 혁신적인 어조입니다.
• 헤드라인 대담하고 직접적이며 혜택 중심적인 진술입니다.
• CTA 행동을 유도하고 초대하는 스타일입니다.

• 순백 배경을 사용하지 마세요 — 스크린샷에는 대신 따뜻한 오프 화이트가 보입니다.
• 세리프 디스플레이 폰트를 사용하지 마세요 — 스크린샷에는 기하학적 또는 휴머니스트 산세리프가 보입니다.
• 밝은 네온 악센트를 사용하지 마세요 — 스크린샷에는 깊고 채도 높은 퍼플이 보입니다.
• 레이아웃을 어지럽히지 마세요 — 스크린샷에는 넉넉한 여백과 중앙 정렬이 보입니다.
• 가장자리가 선명한 drop shadow를 사용하지 마세요 — 스크린샷에는 부드럽고 확산된 box-shadow가 보입니다.
• UI 요소에 날카로운 모서리를 사용하지 마세요 — 스크린샷에는 최대 16px의 둥근 모서리가 보입니다.
• 피하기: 수동적인 언어
• 피하기: 설명 없는 지나치게 전문적인 용어
• 피하기: 모호한 약속

10

팩 안의 실제 스크린샷

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

11

System Prompt

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