Anthropic
따뜻한 느낌의 양피지에 인쇄된 과학 분야 저널—차분한 상아색 표면, 세리프체로 쓰인 편집 제목, 그리고 필요한 순간에만 나타나는 단 하나의 점토색 포인트.
앤스로픽의 인터페이스는 따뜻한 양피지에 인쇄된, 세심하게 선별된 과학 논문처럼 느껴집니다. 전형적인 기술 디자인에서 볼 수 있는 차가운 회색 계열 대신 아이보리와 오트밀 같은 중성적인 색조가 사용되어 모든 표면에 종이 질감을 부여하고, 본문과 제목 텍스트에 전례 없는 크기로 사용된 맞춤형 세리프 서체와 조화를 이룹니다. 점토색 계열의 포인트 색상은 활동이 있을 때만 나타나며, 나머지는 모두 차분하고 절제된 분위기를 유지합니다. 구성 요소는 평면적이며, 얇은 테두리와 선택적으로 적용된 하단 모서리 곡률이 그림자를 대체하는 디자인 언어입니다. 산세리프 서체는 인터페이스 요소를 나타내고, 세리프 서체는 표현력을 전달합니다.
이 디자인은 빈티지 과학 일러스트레이션이 주를 이룹니다. 홈페이지에는 19세기 야외 안내서를 연상시키는 고전적인 자연주의 일러스트레이션 스타일로 표현된 나비와 나방의 빽빽한 식물/동물학적 콜라주가 있습니다. 일러스트레이션은 배경과 조화를 이루도록 따뜻한 색감으로 처리되어 눈에 띄지 않습니다. 사진, 제품 스크린샷, 추상적인 그라데이션은 사용되지 않았습니다. 아이콘은 최소화되어 드롭다운 메뉴에는 작은 화살표가, 텍스트와 동일한 따뜻하고 중성적인 색조의 선형 표시기만 사용되었습니다. 시각적 밀도는 낮습니다. 큰 텍스트 블록과 여백이 주를 이루며, 이미지는 홈페이지 범위 내에서만 나타납니다.
팔레트
상표
- Clay
#d97757— 채워진 클릭 유도 버튼(예: "쿠키 동의 수락")은 시스템에서 유일하게 강조된 색상으로, 일반적인 UI 파란색이 아닌 흙색 계열에 속하는 따뜻한 테라코타 색상입니다. - Clay Deep
#c6613f— Clay 콜투액션 버튼의 마우스 오버/누름 상태와 발음 구별 기호가 포함된 정규 토큰은 기본 발음 구별 기호보다 더 심화된 버전입니다.
중립적
- Slate Dark
#141413— 본문, 제목, 바닥글 배경, 얇은 테두리는 거의 검정색에 가까운 색상에 약간의 따뜻한 느낌을 더하고, 순수한 검정색은 사용하지 않습니다. - Ivory Medium
#f0eee6— 페이지의 바탕과 넓은 면적을 채우는 부분은 전체적으로 따뜻한 분위기를 연출하는 양피지 재질의 배경입니다. - Ivory Light
#faf9f5— 골판지 표면, 돌출된 패널, 클릭식 버튼은 캔버스보다 한 단계 더 밝아 레이어드된 그림자 없는 효과를 냅니다. - Cloud Medium
#b0aea5— 절제된 보조 텍스트, 비활성화된 탐색 요소, 추가 레이블 등, 완전히 사라지지 않으면서도 배경 속으로 스며드는 중립적인 스타일입니다. - Cloud Dark
#87867f— 테두리가 있는 버튼 프레임, 중간 대비 구분선 - Stone
#cccbc8— 각 구역 사이의 미묘한 경계선과 구분선이 보이지만 결코 지나치게 두드러지지는 않습니다.
타이포그래피
12px에서 68px로 · 6단계
- Anthropic Serif — 대사: Georgia · 요점 400, 600 · 편집 스타일 – 68px 헤더, 20px 본문 텍스트, 카드 제목 및 보조 단락에 사용됩니다. 세리프 글꼴은 텍스트에 개성을 더하며, 본문 텍스트에 세리프 글꼴이 사용된 것은 (기술 웹사이트에서는 흔하지 않음) 연구 간행물임을 나타냅니다. 기본 글꼴 두께는 400이며, 강조를 위해 600 두께를 사용합니다.
- Anthropic Sans — 대사: Inter · 요점 400, 500, 600, 700 · 사용자 인터페이스와 산세리프체 표시에는 내비게이션 링크, 버튼, 바닥글, 아이콘, 그리고 61px 크기에 700 굵기의 굵은 산세리프체 헤드라인이 포함됩니다. 61px 산세리프체는 68px 세리프체 옆에 배치되어 의도적으로 이중 체계를 만들어냅니다. 산세리프체는 서술적인 표현을, 세리프체는 논설과 같은 느낌을 전달합니다.
- Anthropic Mono — 대사: JetBrains Mono · 요점 400 · 코드나 기술 문서에서만 사용되는 드문 경우입니다.
간격과 형태
| 목적 | 의미 |
|---|---|
| 밀도 | 밀집한 |
| 기본 단계 | 8px |
| 버튼 반경 | 8px (bottom-only on filled variants), 12px (outlined) |
| 카드 반경 | 24px |
| 그림자 | 아니요 - 그림자 대신 테두리를 사용합니다. |
| 구간 사이 | 80-120px |
| 페이지 너비 | 1280px |
AI가 Anthropic 스타일로 웹사이트를 구축하고 내용을 채워줍니다.
- 제품 및 게시물을 링크를 통해 Instagram, TikTok, Facebook 에 올려주세요.
- 이전 사이트의 콘텐츠를 전송하세요. 주소만 지정하면 됩니다.
- 최신 디자인과 최고의 엔진인 React ( Next.js)를 기반으로 서버 렌더링 및 SEO 최적화 기능을 기본 제공합니다.
- 검색 결과 최적화 및 신경망 기반 추천 기능을 완벽하게 자동화했습니다.
비슷한 스타일
- ElevenLabs — 따뜻한 크림색 톤의 사진 에세이에 은은한 제목이 더해졌습니다. 바우하우스 스타일의 노트는 달걀 껍질색 종이에 검정 잉크를 사용하고, 보라색과 주황색으로 포인트를 주어 제품을 돋보이게 합니다.
- Awesomic — 편집용 아연 메시 소재에 색종이 조각을 연상시키는 주황색 구두점이 있습니다.
- Monad — 따뜻한 양피지에 대한 편집 기술 저널
- Dub — 링크의 무광택 쌀 종이 재질 컨트롤 패널
- Seline Analytics — 따뜻한 종이 위에 놓인 조용한 분석표
- Notion — 한낮의 따스한 햇살 아래 따뜻한 종이 노트
- Calendly — 차가운 대리석 위에 진한 파란색 잉크
- Augen Pro — 애플의 하얀색 프레젠테이션은 단색 공간에 깔끔하고 가벼운 느낌의 강렬한 파란색을 유일한 포인트 색상으로 사용했습니다.
- Antimetal — 크림색 종이에 인쇄된 편집 기록 - 절제가 자신감을 드러내고 세리프체가 중요한 역할을 하는 과학 저널의 조용한 아침.
- Perk — 따뜻한 양피지 위에 전기 석회
- Ditto — 햇살 가득한 작업실에서 야생화 샘플을 제작하고 있습니다. 따뜻한 크림색 표면에 생생한 노란색 바탕색, 짙은 남색 잉크, 작품 뒤편으로 피어나는 유기적인 색채의 형태들이 어우러져 있습니다.
- Officevibe — 따뜻한 크림색 종이에 인쇄된 잡지. 인사 관리에 대한 심도 있는 에세이가 하나의 상품처럼 담겨 있다고 상상해 보세요. 모던한 파란색 인터페이스를 배경으로 부드러운 필기체 글꼴이 은은하게 흘러나옵니다.