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
Airbnb — bản xem trước của một trang web theo phong cách này

Airbnb

Một bức tường trưng bày màu trắng tĩnh lặng với một chiếc bookmark màu đỏ san hô duy nhất.

Airbnb hoạt động theo phong cách "tấm vải trắng", nơi nhiếp ảnh đóng vai trò tối quan trọng: hầu hết mọi màn hình đều là khung hình đơn sắc tĩnh lặng, cho phép hình ảnh toàn màn hình của các bất động sản truyền tải ấn tượng tổng thể, với một điểm nhấn màu đỏ san hô đậm (Rausch) duy nhất làm dấu hiệu màu sắc biểu thị hoạt động. Phông chữ là kiểu sans-serif hình học (Airbnb Cereal VF) - chủ yếu là các cỡ nhỏ, rõ nét - cho văn bản chính, giao diện và tiêu đề các mục (22-22) - với khoảng cách dòng âm hẹp và khoảng cách dòng rộng rãi, giúp các thẻ có văn bản dày đặc dễ đọc. Giao diện phẳng, không khung và bo tròn: bán kính 12-3 trên các thẻ và điều khiển, các nút hình viên thuốc tròn và bóng mờ mềm mại, nhiều lớp chỉ dành cho các yếu tố nổi bật như thanh tìm kiếm. Mọi thứ khác - thẻ, mục danh sách, liên kết - đều dựa vào khoảng trắng và các đường nét mảnh thay vì các điểm nhấn mạ crôm.

Bố cục toàn chiều rộng không giới hạn chiều rộng tối đa cố định—nội dung trải dài từ cạnh này sang cạnh khác trong khu vực hiển thị, với khoảng cách đệm ngang khoảng 40px ở mỗi bên trên máy tính để bàn. Phần nổi bật là một ô tìm kiếm nổi, được đặt ở giữa trên nền trắng trung tính không có hình ảnh hoặc tiêu đề—thanh tìm kiếm CHÍNH LÀ phần nổi bật. Bên dưới ô tìm kiếm, trang chuyển tiếp thành các phần xếp chồng theo chiều dọc, cuộn ngang (bốn hàng hiển thị: Nhà nổi bật, Khách sạn tuyệt vời, Thành phố khác, Có sẵn tháng tới), mỗi hàng cao khoảng 320px, được ngăn cách bởi khoảng cách dọc 48px. Mỗi phần sử dụng lưới 7 thẻ với tràn ngang và điều hướng mũi tên. Chân trang là lưới 3 cột gồm các liên kết trên nền #f7f7f7, tiếp theo là thanh dưới cùng với thông tin bản quyền, tùy chọn ngôn ngữ/tiền tệ và biểu tượng mạng xã hội. Thanh điều hướng là thanh trên cùng cố định với điều hướng tab được căn giữa và các điều khiển được căn phải.

Hệ thống hình ảnh chủ đạo là nhiếp ảnh, với hình ảnh toàn màn hình về các bất động sản được đăng tải làm nội dung chính. Tất cả ảnh đều là ảnh chụp nội thất và ngoại thất ấm áp, đủ ánh sáng của các ngôi nhà và khách sạn thực tế, được xử lý với hiệu chỉnh màu sắc tự nhiên (không sử dụng bộ lọc mạnh hoặc tông màu kép). Hình ảnh được cắt xén sát với tỷ lệ khung hình 1:1 cho các thẻ tin đăng, lấp đầy toàn bộ cạnh thẻ mà không bị tràn. Các biểu tượng trong toàn bộ giao diện có đường viền đơn sắc (độ dày đường kẻ ~16–16), được sử dụng một cách tiết kiệm cho các danh mục điều hướng và các điều khiển giao diện người dùng. Logo là yếu tố đồ họa đa màu duy nhất (Rausch). Không có hình minh họa, không có hình ảnh 3D, không có đồ họa trừu tượng—ngôn ngữ hình ảnh hoàn toàn là nhiếp ảnh và biểu tượng đơn sắc tối giản trên nền trắng mềm mại.

Bảng màu

Thương hiệu

  • Rausch #ff385c — Màu đỏ được sử dụng như một điểm nhấn trang trí cho các biểu tượng, biển báo và các chi tiết đồ họa nhỏ. Không nên sử dụng màu đỏ làm màu chủ đạo cho các lời kêu gọi hành động.
  • Rausch 600 #e00b41 — Một phiên bản nén và tối màu của sơn Rausch dùng cho các bề mặt được nhấn nhá thương hiệu trên các bề mặt tương tác/di chuột.

Trung lập

  • Hof #222222 — Phần nội dung chính, văn bản chính, tiêu đề, đường viền biểu tượng và nền đảo ngược đều có màu trung tính gần với màu đen, tạo nên nền tảng cho toàn bộ hệ thống không màu.
  • Foggy #6a6a6a — Văn bản phụ, chú thích được làm mờ, văn bản bổ trợ, biểu tượng được tắt và siêu dữ liệu kín đáo bên dưới tiêu đề thẻ.
  • Grey 500 #c1c1c1 — Văn bản bị vô hiệu hóa, văn bản giữ chỗ trong các trường nhập liệu và đường viền biểu tượng được làm mờ khi cần giảm bớt sự nhấn mạnh vào trạng thái.
  • Bebe #ebebeb — Viền mỏng, các ô nhập liệu được gạch chân, đường phân cách giữa các dòng trong danh sách và các đường phân chia tinh tế.
  • Deco #dddddd — Hình nền cho các thẻ có vùng chứa không hoạt động, hình ảnh giữ chỗ và trạng thái thẻ bị vô hiệu hóa.
  • Faint #f7f7f7 — Hình nền trang, bề mặt chân trang và trạng thái khi rê chuột của các phần tử tương tác đều có tông màu kem nhẹ nhàng, tạo nên sự khác biệt cho trang này so với các thẻ màu trắng tinh khiết.

Kiểu chữ

Từ 11 đến 28px · 5 bước

  • Airbnb Cereal VF — thay thế: Circular · phác thảo 400, 500, 600, 700 · Một phông chữ sans-serif hình học tùy chỉnh được thiết kế cho Airbnb. Văn bản chính được đặt ở vị trí 14px/400, nhãn giao diện người dùng ở 16px/500, tiêu đề phần ở 20px/600, 22px/500 với khoảng cách chữ hẹp -0.02em, và tiêu đề trang ở 28px/700. Khoảng cách chữ âm giảm dần khi kích thước tăng lên, một đặc điểm của phông chữ sans-serif hình học ở kích thước màn hình lớn hơn. Cho phép tính năng ký tự thay thế "salt".

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

Mục đíchNghĩa
Tỉ trọngdày đặc
Bước cơ bản12px
Bán kính nút9999px
Bán kính thẻ12px
Bóng tốibóng mềm
Giữa các phần48px
Chiều rộng trang1440px

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

  • Apple (España) — tủ trưng bày màu trắng
  • Silencio — Một căn phòng trắng với những hiện vật lơ lửng. Một không gian trưng bày được làm từ giấy màu ấm, nơi mỗi yếu tố chiếm vị trí riêng của nó trên nền âm bản, và sự tĩnh lặng là một quyết định thiết kế có chủ ý.
  • Oakâme — Một xưởng làm việc ở vùng Provence ngập tràn ánh nắng, được chạm khắc từ những phiến đá ấm áp.
  • Nike — Một phòng trưng bày đơn sắc về những thành tích thể thao – những bức tường trắng, sản phẩm như một tác phẩm nghệ thuật, lớp mạ crôm hòa quyện vào nền.
  • Arc — phòng trưng bày màu trắng công nghiệp trên mặt nước lúc nửa đêm
  • Rivian — Một khối kiến trúc điện khổng lồ trên bức tường bê tông của phòng trưng bày. Rivian trình bày mỗi chiếc xe như một tác phẩm điêu khắc trên nền không gian trắng rộng lớn, với kiểu chữ lớn đến mức trở thành một yếu tố kiến trúc, và một màu vàng ấm áp duy nhất phá vỡ bầu không khí đơn sắc, giống như ánh nắng mặt trời trên một bề mặt mờ.
  • Analogue — Tủ trưng bày màu đen – hàng hóa lơ lửng trong không trung.
  • ddna — tủ trưng bày bảo tàng ấm áp trên vải lanh chưa qua xử lý
  • Zellerfeld — Xưởng điêu khắc trên đá cẩm thạch trắng—những bề mặt nguyên khối của bệ đỡ, một tia sáng coban duy nhất, những chữ cái viết thường thì thầm từ sàn đến trần nhà.
  • UY Studio — Hành lang đá của tu viện là một không gian yên tĩnh với những bức tường bê tông, nơi những lọ nước hoa được đặt trên bệ trắng, chiếu sáng bởi một đèn 400 watt và bốn bóng đèn màu xám ấm áp.
  • Basic.Space — phòng trưng bày trên đá cẩm thạch trắng.
  • COS — một phòng trưng bày hợp thời trang với những bức tường trắng.