Vivid+Co
ánh sáng lăng kính xuyên qua đá obsidian
Vivid+Co hoạt động trong một không gian tối tăm, đậm chất điện ảnh: một nền gần như đen kịt với các sắc độ từ #101010 đến #495764, bị gián đoạn bởi một màu trắng gần như hoàn toàn (#fffdf9) được sử dụng cho hầu hết các kiểu chữ và yếu tố giao diện. Kiểu chữ chủ yếu được thể hiện bằng phông Neue Montreal với độ đậm 400 – một sự từ chối có chủ ý đối với kiểu chữ đậm, nơi mà uy quyền đạt được thông qua kích thước (136px và 105px) chứ không phải độ đậm. Một kỹ thuật đặc trưng là lăng kính màu: các khối ánh sáng đỏ/xanh lá/xanh dương bão hòa, được phân tách bằng RGB, lọc qua các khối thủy tinh, phá vỡ bề mặt đơn sắc. Bố cục được căn giữa và rộng rãi; thanh điều hướng, nội dung chính và các liên kết đều có một màu #fffdf9 duy nhất, không có nút nhấn, màu nền hoặc bóng đổ riêng biệt – sự khác biệt đạt được thông qua khoảng cách, kích thước và một hiệu ứng cầu vồng đóng vai trò là điểm nhấn màu sắc duy nhất của thương hiệu.
Một bố cục tối màu, trải rộng toàn màn hình với một cột nội dung duy nhất, kích thước tối đa khoảng 1440px. Yếu tố chính là một hình lăng trụ được đặt ở giữa, với tiêu đề chồng lên nhau (văn bản giao nhau với các khối lập phương) và phụ đề được căn lề trái. Thanh điều hướng nằm ở phía trên mỏng: logo ở bên trái, bốn liên kết ẩn ở bên phải và một nút "Liên hệ" riêng ở cuối hàng. Nhịp điệu của các phần xen kẽ giữa các bảng tiêu đề chính cao hết cỡ và các dải nội dung hẹp hơn với khoảng cách khoảng 108px. Bố cục nội dung không đối xứng: hình lăng trụ đóng vai trò là trung tâm trực quan, và các tiêu đề bao quanh nó. Các khối văn bản một cột có chiều rộng tối đa khoảng 440px; không có lưới nhiều cột, ma trận thẻ và bảng giá. Chân trang là một dải mỏng, được chia bởi một đường mỏng, với hai cột siêu dữ liệu.
Yếu tố thiết kế chính là hình ảnh 3D trừu tượng của các khối lập phương thủy tinh với hiệu ứng quang sai màu ở các cạnh, được phân tách bằng màu RGB. Không có ảnh chụp, không có hình ảnh người, không có ảnh sản phẩm. Lăng kính là hình ảnh đại diện của thương hiệu; mọi thứ khác đều là kiểu chữ đơn sắc trên nền tối. Biểu tượng được tối giản: các nhãn điều hướng tinh tế và một dấu nhấn nhỏ (vùng 142765) ở cuối một trong các tiêu đề gợi ý về một biểu tượng đơn tuyến 16px. Không có hình minh họa, không có họa tiết trang trí, không có kết cấu.
Bảng màu
Trung lập
- Bone White
#fffdf9— Văn bản chính, nhãn điều hướng, màu liên kết và màu nền tiêu đề đều có màu gần trắng, chiếm toàn bộ bề mặt chữ trên nền tối. - Obsidian
#101010— Nền của trang, dùng để tô màu cho các sọc chính và sọc phân chia, có màu đen đậm với hiệu ứng lăng kính bên trong. - Graphite Veil
#495764— Phía sau các tiêu đề và khối nội dung, một màu xám đậm mát mẻ chiếm ưu thế, tạo chiều sâu cho bố cục mà không cần sử dụng màu đen tuyền. - Ash Border
#403f3f— Một đường phân chia tinh tế và đường viền thẻ được sử dụng ở khoảng cách 1px để phân tách các dòng mà không làm ảnh hưởng đến văn bản. - Fog Blue
#6f879c— Văn bản phụ mờ nhạt và nhãn nút tinh tế (tỷ lệ tương phản 3,7:1) – các tên gọi danh mục dịch vụ như “Chiến lược”, “Sáng tạo”, “Truyền thông + Tiếp thị” được coi là siêu dữ liệu không nổi bật. - Pure Black
#000000— Màu trang trí dùng để tô điểm cho các biểu tượng và hình minh họa SVG—được sử dụng trong hình ảnh lăng kính và các ký tự biểu tượng; không phải là màu nền.
Kiểu chữ
Từ 15 đến 136px · 9 bước
- Neue Montreal — thay thế: Söhne · phác thảo 400, 700 · Phông chữ độc quyền được sử dụng xuyên suốt giao diện người dùng—tiêu đề, nội dung chính, điều hướng, nút bấm, liên kết và chân trang. Độ đậm 400 là mặc định; độ đậm 700 chỉ dành riêng cho tiêu đề phụ. Các tiêu đề có độ đậm 105px và 136px có khoảng cách dòng là 1.00–1.01em và khoảng cách chữ là -0.02em, tạo ra các tiêu đề xếp chồng lên nhau mang tính điện ảnh, tạo cảm giác điêu khắc hơn là kiểu chữ thông thường.
Khoảng cách và hình thức
| Mục đích | Nghĩa |
|---|---|
| Tỉ trọng | rộng rãi |
| Bước cơ bản | 7px |
| Bán kính nút | 0px |
| Bán kính thẻ | 15px |
| Bóng tối | không - viền thay vì bóng |
| Giữa các phần | 108px |
| Chiều rộng trang | 1440px |
AI sẽ xây dựng trang web của bạn theo phong cách Vivid+Co 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ự
- 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.
- 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.
- MekaVerse — Một phòng trưng bày đơn sắc các hiện vật kỹ thuật số—một khoảng không đen kịt nơi thế giới được dựng hình treo lơ lửng như một vật trưng bày trong bảo tàng, và toàn bộ giao diện người dùng là mực trắng trên nền kính đen mờ.
- Krea — phòng trưng bày đen tối lúc nửa đêm
- Factory — Màn hình điều khiển "phòng tác chiến" lúc nửa đêm. "Nhà máy" là một bảng điều khiển màu đen tuyền, nơi một tấm thẻ trắng duy nhất đáp xuống như một thông điệp được chiếu sáng bằng đèn pin—vật thể duy nhất trong căn phòng là chính công việc đang được thực hiện.
- basement — Một máy in trống rỗng lúc 3 giờ sáng – những phông chữ khổng lồ, nén chặt trải dài trên nền đen kịt, một vệt sáng màu cam duy nhất trên thanh điều hướng, mọi thứ khác đều trắng hoặc xám lờ mờ.
- Stink Studios — Một xưởng phim lúc nửa đêm - máy chiếu kêu vo vo, căn phòng tối om, chỉ có cuộn phim được chiếu sáng.
- Apple (España) — Nhà hát màu đen với các thiết bị chiếu sáng.
- Charlie — Chữ viết được khắc trên đá tu viện lên đá obsidian. Một tập hồ sơ mà trong đó một bức tường đỏ duy nhất tạo nên sự im lặng đến điếc tai.
- Rive — Tầm nhìn ban đêm độ chính xác cao. Giao diện có thấu kính đặc biệt xuyên thấu bóng tối để tập trung vào các chi tiết kỹ thuật với độ rõ nét tuyệt đối.
- Datalands — Một nhà thờ màu đen với một luồng sáng neon duy nhất. Logo chiếm trọn gian giữa; mọi thứ khác chỉ là những dòng chữ mờ nhạt nằm bên dưới.