Figma
Khung máy đơn sắc cho sự hỗn loạn màu sắc
Giao diện hoạt động như một khung cấu trúc nghiêm ngặt, có độ tương phản cao, mang lại sự ưu thế trực quan hoàn toàn cho nội dung do người dùng tạo ra. Bảng màu cơ bản là từ #000000 đến #ffffff, loại bỏ các sắc thái xám tinh tế để ưu tiên độ tương phản tối đa tuyệt đối cho các đường viền và văn bản chính. Thứ bậc kiểu chữ gần như hoàn toàn dựa trên kích thước và khoảng cách chữ âm mạnh mẽ hơn là sự biến đổi màu sắc, biến các dòng văn bản lớn thành các khối đồ họa dày đặc. Logic về bán kính đường viền tạo ra sự tương phản rõ rệt: các "mũi đinh" ngoài 50px cho các yếu tố điều hướng toàn cục cố tình tương phản với các góc 0px sắc nét của các khung chứa nội dung.
Bố cục dựa trên các đường viền có chiều rộng tối đa cực lớn (tối đa 1440px) giúp căn giữa khung nhìn và bao gồm các cụm nội dung dày đặc được phân tách bởi khoảng trống lớn (96-120px khoảng trắng giữa các phần). Kiểu mẫu "anh hùng" thường sử dụng một thư viện hình ảnh không đối xứng được neo động bên dưới một khối giao diện người dùng nổi, được căn giữa hoàn hảo. Bên dưới phần hiển thị đầu tiên, thông tin ngay lập tức tuân theo một lưới bốn cột nghiêm ngặt không có lề, đóng khung các cụm thẻ lặp lại, tối đa hóa mật độ đối tượng đồng thời loại bỏ lề khỏi khung.
Thiết kế hình ảnh dựa trên kết quả hướng đến người dùng. Hình ảnh được hiển thị dưới dạng các hình vuông phẳng, không khung hoặc các mảnh vụn phân tán, chồng chéo, gợi nhớ đến các vật thể vật lý, trên nền trống trơn. Hình ảnh là nguồn màu sắc duy nhất trên trang web. Không có yếu tố nhiếp ảnh đời sống hay hình minh họa doanh nghiệp tiêu chuẩn nào—mỗi yếu tố đồ họa là một ảnh chụp chính xác, chân thực của một không gian kỹ thuật số, đồng thời đóng vai trò là bằng chứng sản phẩm và yếu tố thẩm mỹ chính.
Bảng màu
Thương hiệu
- Context Action Violet
#4d49fc— Nút kêu gọi hành động chính được bố trí cục bộ trong các bảng phụ - một màu sắc nổi bật duy nhất xác định điểm nhấn.
Trung lập
- Absolute Canvas
#ffffff— Hình nền trang, thanh công cụ nổi, chân đế bảng điều khiển nổi. - Structural Ink
#000000— Phông chữ cơ bản, nền nút màu đặc, viền nút. - Graphite Metadata
#595959— Văn bản phụ của tác giả, văn bản phụ bản địa phương, giá trị giữ chỗ - Boundary Frame
#e2e2e2— Các đường phân cách tinh tế và ranh giới trường nhập liệu không hoạt động. - Angular Teal
#33dfdf— Các hiệu ứng trang trí, chỉ báo tải và hiển thị con trỏ đang hoạt động.
Kiểu chữ
Từ 12 đến 72px · 6 bước
- figmaSans — thay thế: Inter · phác thảo 320, 330, 340, 400, 450, 480, 520, 700 · Một công cụ đa năng quản lý mọi thứ, từ tiêu đề hiển thị đến nhãn điều hướng. Nó tạo ra giao diện độc đáo bằng cách điều chỉnh độ lệch âm quang học.
- figmaMono — thay thế: JetBrains Mono · phác thảo 400 · Các thẻ nhỏ, theo dõi tọa độ và những thuật ngữ kỹ thuật đóng vai trò như các yếu tố giao diện người dùng hơn là nội dung.
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 | 24px |
| Bán kính nút | 8px |
| Bán kính thẻ | 12px |
| Bóng tối | không - viền thay vì bóng |
| Giữa các phần | 96-120px |
| Chiều rộng trang | 1440px |
AI sẽ xây dựng trang web của bạn theo phong cách Figma 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ự
- Caldera — Rèn lửa trên đá vôi ấm áp. Bức tranh là lớp vữa thô, ấm áp, và mỗi yếu tố màu cam trông giống như những đốm than hồng âm ỉ được ép vào bề mặt.
- Vercel — Thiết bị đầu cuối được in trên giấy trắng.
- Dylanbrouwer — Xưởng đúc theo phong cách kiến trúc thô mộc lúc hoàng hôn
- Headspace — Một góc thư giãn tràn ngập ánh nắng trên nền giấy ấm áp.
- WHOOP — Phòng thí nghiệm trình diễn lúc nửa đêm - những chiếc bàn thí nghiệm màu trắng tinh khôi dưới một khoảng không đen kịt đầy kịch tính, một xung điện màu tím duy nhất.
- (dot)connect — Một bản vẽ kỹ thuật của Thụy Sĩ chỉ với một mẩu than chì.
- Together AI — Bảng điều khiển nghiên cứu trên giấy băng hà
- Vivid+Co — ánh sáng lăng kính xuyên qua đá obsidian
- Sequel — Buổi chiếu phim riêng sau khi trời tối là tia sáng ấm áp duy nhất trong một rạp chiếu phim tối tăm.
- v0 by Vercel — Bản vẽ tiện. Độ chính xác và tính năng là tối quan trọng, với mỗi yếu tố đều phục vụ một mục đích rõ ràng trên một bề mặt sạch sẽ, hoàn hảo về mặt kỹ thuật.
- ThoughtLab — Một tượng đài bằng đá obsidian với tín hiệu màu đỏ thẫm. Một bức tranh trống rỗng màu đen, nơi vật thể màu đỏ rực rỡ duy nhất trong nhà thờ, được in bằng chữ trắng lớn, là một hình ảnh đơn sắc.
- Dovetail — Bản thiết kế dưới ánh trăng đen – những đường kẻ đồ thị mờ nhạt, chữ trắng, một đốm tím lấp lánh.