Anthropic
Một cuốn nhật ký khoa học thực địa trên giấy da ấm áp—bề mặt màu ngà dịu nhẹ, tiêu đề biên tập có chân chữ và một điểm nhấn bằng đất sét duy nhất chỉ xuất hiện khi cần hành động.
Giao diện của Anthropic giống như một ấn phẩm khoa học được tuyển chọn kỹ lưỡng trên giấy da ấm áp. Các tông màu trung tính như trắng ngà và màu yến mạch thay thế bảng màu xám lạnh thường thấy trong các thiết kế lấy cảm hứng từ công nghệ, tạo cho mọi bề mặt một kết cấu giống giấy, bổ sung cho kiểu chữ serif tùy chỉnh được sử dụng với quy mô chưa từng có cho cả văn bản chính và tiêu đề. Một điểm nhấn màu đất sét duy nhất chỉ xuất hiện trong những khoảnh khắc hoạt động; mọi thứ khác vẫn giữ vẻ tĩnh lặng và trang nhã. Các thành phần phẳng – đường viền mỏng và bán kính góc dưới được chọn lọc thay thế cho hiệu ứng đổ bóng làm ngôn ngữ thiết kế, với kiểu chữ sans-serif đại diện cho các yếu tố giao diện và kiểu chữ serif truyền tải sự biểu cảm.
Thiết kế chủ đạo là các hình minh họa khoa học cổ điển: trang chủ có một bộ sưu tập dày đặc các loài bướm và sâu bướm, được thực hiện theo phong cách minh họa tự nhiên cổ điển gợi nhớ đến các cẩm nang thực địa thế kỷ 19. Các hình minh họa có màu sắc ấm áp để hòa quyện với nền giấy da thay vì nổi bật lên. Không có ảnh chụp, ảnh chụp màn hình sản phẩm hoặc hiệu ứng chuyển màu trừu tượng. Biểu tượng được tối giản – các mũi tên nhỏ cho menu thả xuống và các chỉ báo tuyến tính thưa thớt, luôn luôn trong cùng một bảng màu ấm áp, trung tính như văn bản. Mật độ hình ảnh thấp: các khối văn bản lớn và khoảng trắng chiếm ưu thế, và hình ảnh chỉ xuất hiện trong phạm vi trang chủ.
Bảng màu
Thương hiệu
- Clay
#d97757— Các nút kêu gọi hành động được tô đầy (ví dụ: "chấp nhận sử dụng cookie") là màu nhấn duy nhất trong hệ thống, một sắc thái đất nung ấm áp thuộc nhóm tông màu đất chứ không phải màu xanh lam giao diện người dùng thông thường. - Clay Deep
#c6613f— Trạng thái rê chuột/nhấn chuột của các nút kêu gọi hành động trong Clay và mã chuẩn có dấu phụ là một phiên bản sâu hơn của dấu phụ cơ bản.
Trung lập
- Slate Dark
#141413— Văn bản chính, tiêu đề, nền chân trang, viền mỏng - gần như đen với một chút sắc ấm, không bao giờ là đen tuyền. - Ivory Medium
#f0eee6— Bề mặt trang giấy và các mảng màu lớn được phủ kín tạo nên một phông nền màu giấy da, thiết lập nên tổng thể tông màu ấm áp. - Ivory Light
#faf9f5— Các bề mặt bằng bìa cứng, các tấm nổi và các nút bấm tương tác có độ sáng cao hơn một chút so với vải bố, tạo hiệu ứng nhiều lớp và không có bóng. - Cloud Medium
#b0aea5— Văn bản phụ mờ nhạt, các yếu tố điều hướng không hoạt động, nhãn bổ sung—một phong cách trung tính hòa vào nền mà không biến mất. - Cloud Dark
#87867f— Khung nút được viền, đường phân cách có độ tương phản trung bình. - Stone
#cccbc8— Các đường viền và vách ngăn giữa các phần được bố trí tinh tế nhưng không bao giờ quá lộ liễu.
Kiểu chữ
Từ 12 đến 68px · 6 bước
- Anthropic Serif — thay thế: Georgia · phác thảo 400, 600 · Phong cách biên tập – được sử dụng cho tiêu đề 68px, toàn bộ văn bản chính 20px, tiêu đề thẻ và các đoạn văn hỗ trợ. Phông chữ serif tạo thêm cá tính cho văn bản; sự hiện diện của nó trong văn bản chính (khá hiếm thấy trên các trang web kỹ thuật) cho thấy đây là một ấn phẩm nghiên cứu. Độ đậm phông chữ 400 là mặc định, độ đậm phông chữ 600 được sử dụng để nhấn mạnh.
- Anthropic Sans — thay thế: Inter · phác thảo 400, 500, 600, 700 · Giao diện người dùng và cách hiển thị của phông chữ sans-serif bao gồm các liên kết điều hướng, nút bấm, chân trang, biểu tượng và tiêu đề sans-serif in đậm với độ dày 61px 700. Phông chữ sans-serif 61px được đặt cạnh phông chữ serif 68px, cố ý tạo ra một hệ thống kép: phông chữ sans-serif thể hiện các câu tuyên bố, trong khi phông chữ serif mang cảm giác như một bài luận biên tập.
- Anthropic Mono — thay thế: JetBrains Mono · phác thảo 400 · Chỉ được sử dụng trong mã lập trình hoặc các đoạn văn kỹ thuật - rất hiếm gặp.
Khoảng cách và hình thức
| Mục đích | Nghĩa |
|---|---|
| Tỉ trọng | dày đặc |
| Bước cơ bản | 8px |
| Bán kính nút | 8px (bottom-only on filled variants), 12px (outlined) |
| Bán kính thẻ | 24px |
| Bóng tối | không - viền thay vì bóng |
| Giữa các phần | 80-120px |
| Chiều rộng trang | 1280px |
AI sẽ xây dựng trang web của bạn theo phong cách Anthropic và điền đầy đủ thông tin vào đó.
- Đăng tải sản phẩm và bài viết qua các liên kết sau: Instagram, TikTok, Facebook.
- Chuyển nội dung từ trang web cũ của bạn—chỉ cần chỉ định địa chỉ.
- Thiết kế hiện đại trên nền tảng tốt nhất: React ( Next.js) với khả năng render phía máy chủ và tối ưu hóa SEO ngay từ đầu.
- Tối ưu hóa SEO hoàn toàn tự động cho kết quả tìm kiếm và đề xuất dựa trên mạng thần kinh.
Phong cách tương tự
- Mollie — Quầy cashmere, sổ sách kế toán màu tối. Để lại khoảng trắng rộng rãi cho thiết kế biên tập xung quanh văn bản màu đen, sau đó nhấn mạnh các điểm liên quan đến sản phẩm bằng các gam màu kem ấm áp, nâu cà phê espresso và hình ảnh thực tế về các phương thức thanh toán.
- Kagi — Một phòng đọc riêng biệt. Tạo một không gian trắng thoáng đãng xung quanh những dòng chữ in đậm bằng than chì, sử dụng những điểm nhấn màu tím nhẹ nhàng và các bề mặt màu pastel ấm áp để phá vỡ sự tĩnh lặng.
- Milanote — Milanote là một studio sáng tạo chuyên nghiệp. Chúng tôi tạo ra các trang theo phong cách trưng bày ảnh bằng cách sử dụng bảng hình ảnh nổi: tường khung tối màu, không gian hiển thị màu trắng và ảnh chụp màn hình trông giống như vật thể thật với chiều sâu mềm mại.
- Co2 — Một tập bản đồ khí hậu dưới ánh sáng mùa đông. Tạo các trang giống như một tài liệu phong cảnh nhìn từ trên cao, nơi các tiêu đề có chân chữ, dữ liệu được mã hóa theo danh mục và hình ảnh băng giá làm nổi bật các lề trắng rộng.
- GitButler — Màu ngọc lam ở cuối văn bản. Sự kết hợp giữa các tiêu đề có chân chữ độ tương phản cao với các đường kẻ lưới kỹ thuật tinh tế, bề mặt màu than chì ấm áp và điểm nhấn màu ngọc lam kín đáo.
- ElevenLabs — Một bộ ảnh minh họa với tông màu kem ấm áp và tiêu đề tinh tế. Một cuốn sổ tay theo phong cách Bauhaus – giấy màu trắng ngà, mực đen và điểm nhấn màu tím và cam duy nhất để trưng bày sản phẩm.
- Awesomic — Phông chữ in hoa bằng lưới kẽm với các dấu chấm câu màu cam gợi nhớ đến những mảnh giấy vụn.
- Monad — Tạp chí kỹ thuật biên tập về giấy da ấm
- Dub — Bảng điều khiển bằng giấy gạo mờ của Link
- Seline Analytics — Một chiếc bàn phân tích yên tĩnh trên nền giấy ấm áp.
- Notion — Một cuốn sổ tay bằng giấy ấm áp dưới ánh nắng mặt trời giữa trưa.
- Calendly — Mực xanh đậm trên nền đá cẩm thạch lạnh.