Figma
색채의 혼돈을 위한 단색 섀시
이 인터페이스는 엄격하고 대비가 강한 구조적 컨테이너 역할을 하여 사용자가 생성한 콘텐츠를 시각적으로 완전히 강조합니다. 기본 색상은 #000000에서 #ffffff까지의 엄격한 색상 팔레트로, 미묘한 회색 음영을 배제하고 주요 테두리와 텍스트에 최대한의 대비를 부여합니다. 타이포그래피 계층 구조는 색상 변화보다는 크기와 공격적인 음수 자간에 거의 전적으로 기반하여 긴 텍스트 줄을 밀도 높은 그래픽 블록으로 변환합니다. 테두리 곡률의 논리는 극명한 대조를 만들어냅니다. 전역 탐색 요소의 바깥쪽 "돌출부"는 50px이고 콘텐츠 컨테이너의 모서리는 0px로 의도적으로 날카롭게 대비됩니다.
레이아웃은 뷰포트를 중앙에 배치하는 최대 너비 테두리(최대 1440px)를 기반으로 하며, 각 섹션 사이에 충분한 여백(96~120px)을 두고 콘텐츠가 밀집된 형태로 배치됩니다. "히어로" 레이아웃은 일반적으로 중앙에 완벽하게 정렬된 UI 블록 아래에 동적으로 고정된 비대칭 이미지 갤러리를 활용합니다. 화면 하단에는 여백 없이 엄격한 4열 그리드에 맞춰 정보가 배치되어, 반복되는 카드 클러스터를 프레임 형태로 구성함으로써 콘텐츠 밀도를 극대화하고 프레임의 여백을 최소화합니다.
시각 디자인은 사용자 중심의 결과에 기반합니다. 이미지는 마치 실제 사물처럼 테두리가 없는 평면 정사각형이나 흩어진 조각 형태로, 텅 빈 배경 위에 배치됩니다. 웹사이트에서 유일한 색상 요소는 이미지입니다. 일반적인 기업 홍보 사진이나 흔한 일러스트레이션은 사용되지 않았으며, 각 그래픽 요소는 디지털 캔버스의 정확하고 사실적인 스냅샷으로서 제품의 실체를 보여주는 동시에 주요 미적 요소로 기능합니다.
팔레트
상표
- Context Action Violet
#4d49fc— 하위 패널 내의 주요 콜 투 액션(CTA)은 단일 색상으로 강조되어 초점을 명확히 합니다.
중립적
- Absolute Canvas
#ffffff— 페이지 배경, 플로팅 툴바, 돌출형 패널 받침대. - Structural Ink
#000000— 기본 글꼴, 단색 버튼 배경, 버튼 윤곽선. - Graphite Metadata
#595959— 보조 저자 텍스트, 현지화된 하위 텍스트, 자리 표시자 값 - Boundary Frame
#e2e2e2— 미묘한 구분선과 비활성화된 입력 필드 경계. - Angular Teal
#33dfdf— 장식 효과, 로딩 표시기 및 활성 커서 시각화.
타이포그래피
12px에서 72px로 · 6단계
- figmaSans — 대사: Inter · 요점 320, 330, 340, 400, 450, 480, 520, 700 · 디스플레이 제목부터 내비게이션 레이블까지 모든 것을 관리하는 다재다능한 도구입니다. 광학적 네거티브 트래킹을 조정하여 독특한 디자인을 구현합니다.
- figmaMono — 대사: JetBrains Mono · 요점 400 · 마이크로태그, 좌표 추적, 그리고 기술적 함의는 콘텐츠라기보다는 사용자 인터페이스 요소처럼 기능합니다.
간격과 형태
| 목적 | 의미 |
|---|---|
| 밀도 | 밀집한 |
| 기본 단계 | 24px |
| 버튼 반경 | 8px |
| 카드 반경 | 12px |
| 그림자 | 아니요 - 그림자 대신 테두리를 사용합니다. |
| 구간 사이 | 96-120px |
| 페이지 너비 | 1440px |
AI가 Figma 스타일로 웹사이트를 구축하고 내용을 채워줍니다.
- 제품 및 게시물을 링크를 통해 Instagram, TikTok, Facebook 에 올려주세요.
- 이전 사이트의 콘텐츠를 전송하세요. 주소만 지정하면 됩니다.
- 최신 디자인과 최고의 엔진인 React ( Next.js)를 기반으로 서버 렌더링 및 SEO 최적화 기능을 기본 제공합니다.
- 검색 결과 최적화 및 신경망 기반 추천 기능을 완벽하게 자동화했습니다.
비슷한 스타일
- Caldera — 따뜻한 석회암 위에 불을 지펴라. 바탕은 거칠고 따뜻한 회반죽이고, 각각의 주황색 요소는 표면에 눌러 붙은 타오르는 불씨처럼 보인다.
- Vercel — 흰 종이에 인쇄된 터미널
- Dylanbrouwer — 석양에 물든 브루탈리즘 양식의 주조 공장
- Headspace — 따뜻한 종이 위에 펼쳐진 햇살 가득한 웰빙 공간
- WHOOP — 한밤중의 퍼포먼스 연구실 - 검은색의 연극적인 공간 아래 놓인 하얀색 임상 실험실 테이블, 그리고 보라색 전기 파동 하나
- (dot)connect — 숯 한 조각으로 그린 스위스 공학 도면
- Together AI — 빙하 종이 연구 콘솔
- Vivid+Co — 흑요석을 통과하는 프리즘 빛
- Sequel — 어두워진 후의 비공개 상영회만이 캄캄한 영화관에서 유일하게 따뜻한 빛이다.
- v0 by Vercel — 선반 가공 도면. 정밀도와 기능성이 최우선이며, 각 요소는 깔끔하고 기술적으로 완벽한 표면 위에서 명확한 목적을 수행합니다.
- ThoughtLab — 붉은색 신호가 새겨진 흑요석 기념비. 칠흑 같은 공허함 속에서, 성당 안에서 유일하게 선명한 붉은색을 띠는 것은 커다란 흰 글자로 인쇄된 단 하나의 색채 있는 형상이다.
- Dovetail — 검은 달 아래 놓인 설계도 - 거의 보이지 않는 그래프 선, 하얀 글씨, 그리고 보라색 반짝임 하나