큐레이션 · 오픈 · 무료

Deel

글로벌 팀을 고용하고, 관리하며, 지불하기 위한 깔끔하고 체계적인 SaaS 플랫폼입니다.

01

디자인 DNA

글로벌 팀 관리를 위한 전문적인 기업용 대시보드.

02

컬러

고대비의 다크 및 라이트 섹션을 갖춘 깔끔한 화이트스페이스로, 밝은 기본 악센트로 안정감을 줍니다.

03

타이포그래피

transitional-serif · humanist-sans · monospace

• display56px · 560
• heading36px · 500
• body16px · 400
• caption14px · 400

헤드라인은 프리미엄 웨이트를 위해 트랜지션 세리프 폰트를 사용합니다. · 본문은 가독성이 뛰어난 휴머니트 산세리프를 사용합니다. · 기본 텍스트 색상은 순수 블랙이 아닌 깊은 차콜(#1B1B1B)입니다.

04

여백

패딩, 간격, 마진에 적용되는 일관된 4px 기본 그리드입니다.

05

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

최소한의 테두리로, 미묘한 그림자와 색상 대비를 사용하여 표면을 정의합니다.

rgba(27, 27, 27, 0.16) 0px 16px 32px 0px · rgba(27, 27, 27, 0.05) 0px 2px 32px 0px

06

레이아웃

멀티컬럼 히어로가 전체 너비의 다크 및 라이트 콘텐츠 밴드로 전환됩니다.

07

모션과 인터랙션

인터랙티브 요소에서의 매끄러운 채우기 및 색상 트랜지션. · 버튼과 링크의 미묘한 hover 변환.

인터랙티브함을 나타내기 위한 미묘한 색상 변화 또는 불투명도 변경. · 버튼 프레스 상태를 통한 즉각적인 시각적 피드백.

08

컴포넌트

• button 고대비(화이트 온 블랙 또는 블랙 온 화이트)의 둥근 알약 형태 버튼으로, 미묘한 border-radius를 가집니다.
• card 가벼운 그림자를 가진 약간 둥근 컨테이너로, 종종 기본 액션이나 이미지가 포함됩니다.
• chip PEO, EOR 같은 기능을 분류하기 위한 아이콘과 함께 사용되는 작은 둥근 태그입니다.
• input 명확한 라벨과 표준 둥근 테두리를 갖춘 깔끔한 폼 필드입니다.
• hero 왼쪽에 큰 텍스트 블록과 오른쪽에 라이프스타일 이미지가 있는 분할 레이아웃입니다.

09

보이스와 금지 목록

• 톤 전문적이고 권위적이며 직설적입니다.
• 헤드라인 핵심 가치 제안을 강조하는 크고 강렬한 문구.
• CTA '데모 예약' 또는 '자세히 알아보기'와 같은 행동 지향적 라벨.

• 밝은 네온색을 사용하지 마세요 — 스크린샷은 블랙, 화이트, 차콜로 구성된 안정적인 팔레트를 보여줍니다.
• 지나치게 장식적인 스크립트를 사용하지 마세요 — 스크린샷은 트랜지션 세리프와 휴머니트 산세리프의 구조화된 조합을 보여줍니다.
• 가혹한 순수 블랙 배경을 사용하지 마세요 — 스크린샷은 다크 모드 섹션을 위해 부드러운 차콜(#141414)을 보여줍니다.
• 날카롭고 직사각형 버튼을 사용하지 마세요 — 스크린샷은 매우 둥근, 알약 형태의 버튼을 보여줍니다.
• 밀도 높고 지저분한 그리드를 사용하지 마세요 — 스크린샷은 넉넉한 화이트스페이스와 명확한 구획을 보여줍니다.
• 얇고 읽기 어려운 폰트를 사용하지 마세요 — 스크린샷은 고대비, 잘 조정된 타이포그래피를 보여줍니다.
• 피하기: 지나치게 캐주얼한 은어를 피합니다.
• 피하기: 지저분한 레이아웃을 피합니다.
• 피하기: 네온색이나 안정감 없는 팔레트를 피합니다.

10

팩 안의 실제 스크린샷

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

11

System Prompt

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