Telegram, WhatsApp+380637610482
Valery Danyuk
Valery Danyuknhà phát triểnPhát triển các công cụ trí tuệ nhân tạo cho doanh nghiệp. Chất lượng cao. Giá cả phải chăng.Nhắn tin qua Telegram
Linear — bản xem trước của một trang web theo phong cách này

Linear

dụng cụ chính xác lúc nửa đêm

Hệ thống thiết kế Linear là một trung tâm chỉ huy ban đêm được xây dựng trên các bề mặt gần như đen (#08090a) với kiểu chữ trắng sắc nét và một điểm nhấn màu xanh lá cây chanh (#e4f222) hoạt động như một chiếc đèn pin chức năng—nhỏ, độ tương phản cao và được sử dụng tiết kiệm để chỉ ra các hành động. Giao diện coi bóng tối là nền tảng hơn là chủ đề: văn bản có màu trắng sắc nét với khoảng cách chữ hẹp (-0.022em), độ đậm phông chữ ở mức thấp 400–510 thay vì đậm, và đường viền siêu mỏng (0.5px) để cho phép hình học thực hiện công việc thường được thực hiện bởi bóng. Các thành phần được chế tác chính xác—bán kính 6px và 12px, lề nhỏ gọn 8–12px và gần như hoàn toàn không có các yếu tố trang trí—cho phép giao diện người dùng sản phẩm (thẻ nhiệm vụ, bảng Kanban, bảng điều khiển tác nhân AI) là kết cấu hình ảnh duy nhất trong một hệ thống tĩnh lặng.

Bố cục có chiều rộng tối đa khoảng 1200px, căn giữa, với nền tối trải rộng đến các cạnh của khung nhìn. Yếu tố chính là tiêu đề lớn, căn lề trái (64–72px), đi kèm với lời kêu gọi hành động (CTA) căn lề phải, tiếp theo là ảnh chụp màn hình sản phẩm lớn, hơi vượt quá chiều rộng tối đa. Nhịp điệu của các phần xen kẽ giữa bố cục hai cột với văn bản ở bên trái và hình ảnh ở bên phải, và các dải hiển thị sản phẩm toàn chiều rộng được phân tách bởi các khoảng trống dọc 96px. Dải có logo của khách hàng là một hàng ngang duy nhất. Trang không bao giờ sử dụng lưới thẻ ba cột hoặc cấu trúc xếp lát – mật độ thông tin vẫn thấp, với hầu hết các phần sử dụng nhiều khoảng trắng và một yếu tố trọng tâm duy nhất trên màn hình. Thanh điều hướng là thanh trên cùng cố định với logo căn lề trái và các liên kết căn lề phải, không có thanh bên hoặc menu lớn.

Ngôn ngữ hình ảnh của Linear dựa trên ảnh chụp màn hình sản phẩm: các hình minh họa ở đầu và trong các phần là hình ảnh thực tế về giao diện người dùng của ứng dụng Linear, được chụp với độ chi tiết tối đa — thẻ tác vụ, bảng Kanban, bảng điều khiển tác nhân AI, bảng lệnh — được đặt trong khung viền mỏng. Không có ảnh có sẵn, không có hình ảnh đời sống, không có hình minh họa trừu tượng. Logo được hiển thị dưới dạng một dải màu xám trung tính (#8a8f98) có kích thước đồng nhất cho khách hàng. Các biểu tượng là hình ảnh SVG tuyến tính tối giản trong thang màu xám đơn sắc. Ảnh chụp màn hình ở đầu trang nổi trên một dải màu chuyển tiếp tuyến tính tinh tế (từ tối đến sáng), tạo chiều sâu không gian mà không cần sử dụng phong cảnh thực. Mỗi yếu tố hình ảnh đều là một yếu tố chức năng của chính sản phẩm.

Bảng màu

Thương hiệu

  • Acid Lime #e4f222 — Các nút điều khiển chính và các chỉ báo điều hướng đang hoạt động là điểm nhấn nổi bật, phá vỡ sự đơn sắc tổng thể.

Trung lập

  • Mist #d0d6e0 — Tiêu đề phụ, văn bản nút trên nền tối
  • Void #08090a — Khung trang, hình nền toàn chiều rộng - theo mặc định, tất cả các phần tử đều được đặt trên hình nền này.
  • Carbon #0f1011 — Các bề mặt thẻ, thanh điều hướng, là một bước nâng cấp so với khung vẽ thông thường để đặt nội dung bên trong các thẻ.
  • Obsidian #161718 — Bề mặt nổi, tấm bìa cứng dày hơn
  • Graphite #23252a — Các đường viền tinh tế, đường phân cách, đường viền nút mờ nhạt – các cạnh có kết cấu độ tương phản thấp
  • Smoke #383b3f — Viền mỏng có độ tương phản cao hơn so với các đường phân cách bằng than chì.

Kiểu chữ

Từ 13 đến 72px · 8 bước

  • Inter Variable — thay thế: Inter (variable) · phác thảo 300, 400, 510, 590 · Phông chữ chính cho giao diện người dùng và tiêu đề - Được sử dụng trong thanh điều hướng, văn bản chính, tiêu đề, nút và thẻ.
  • Berkeley Mono — thay thế: JetBrains Mono · phác thảo 400 · Văn bản giao diện người dùng liền kề mã - mã định danh bản phát hành (ENG-2703), phím tắt, siêu dữ liệu phông chữ đơn cách

Khoảng cách và hình thức

Mục đíchNghĩa
Tỉ trọngrộng rãi
Bước cơ bản8px
Bán kính nút6px
Bán kính thẻ12px
Bóng tốikhông - viền thay vì bóng
Giữa các phần96px
Chiều rộng trang1200px

AI sẽ xây dựng trang web của bạn theo phong cách Linear 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ự

  • Aaru — Đài quan sát trường hạt lúc nửa đêm
  • Atlas Card — Hầm Đêm Tối, với một tia sáng sapphire duy nhất, là một không gian đen kịt nơi thứ duy nhất quan trọng là màu xanh điện sâu thẳm.
  • Checkly — Trung tâm điều khiển nhiệm vụ quỹ đạo sâu
  • Savee — Khung tranh đen dành cho các nhà giám tuyển hình ảnh
  • Inngest — Một đài quan sát tối tăm, yên tĩnh, được trang bị đầy đủ để làm việc với các dụng cụ, được chiếu sáng bởi một ngọn đèn mồi màu hổ phách duy nhất.
  • Dala — một chòm sao lơ lửng trên nền nhung đen
  • Origin Financial — Một không gian tĩnh lặng, sang trọng giữa đêm khuya. Một căn phòng yên tĩnh, gần như tối tăm, nơi những phông chữ serif lớn và một vài tấm bảng màu được chiếu sáng tạo nên cảm giác rằng tài chính là một tác phẩm nghệ thuật được tuyển chọn kỹ lưỡng.
  • Hyperstudio — Họa tiết được khắc trên đá obsidian. Chữ viết và những đường nét tinh tế bao quanh một khoảng trắng trên nền đen tuyền, điểm xuyết những vạch la bàn vàng chỉ hướng.
  • Air — Tác phẩm điêu khắc "Bầu trời đêm qua tấm kính"
  • Resend — nhung đen với màu tím neon
  • Raycast — Trung tâm chỉ huy nửa đêm, màu san hô neon
  • Dimension — một không gian làm việc ngập ánh sáng hoàng hôn với các tấm kính mờ.