← Xem demo Design system · Bạc Hà Kho mẫu
Smile Lab Dental
Đặt lịch

Design system

Bạc Hà

Nha khoa gia đình tươi và trấn an, dành cho người sợ ghế nha. Nền sữa ấm, mực xanh việt quất, bạc hà và một chút san hô. Tiêu đề Fraunces mềm, chữ nhấn không nghiêng mà có nét cười san hô vẽ tay bên dưới. Mọi thứ bấm được là viên nang; ảnh nằm trong khung "nụ cười" có đáy cong như khoé miệng. Nỗi lo của bệnh nhân hiện thành hội thoại hai phía, giờ đầu tiên ở phòng khám là dòng thời gian theo phút, trang đặt lịch có thanh tiến trình 5 bước và phiếu hẹn cập nhật trực tiếp. Bề mặt phẳng, viền mảnh, chỉ chip nổi có bóng mềm.

Font

Tiêu đề, số

Fraunces

Đi nha sĩ mà vẫn nhẹ tênh

Nội dung, nhãn

Plus Jakarta Sans

Bác sĩ nói trước từng bước, báo giá trước khi làm, và bạn có thể giơ tay xin dừng bất cứ lúc nào.

Màu

Nền sữa

#FBF8F3

CMS: Màu nền

Mực

#151B33

CMS: Màu chữ

Việt quất

#1F2A6B

Nút, phiếu hẹn, bong bóng bác sĩ. CMS: Màu chính

Bạc hà

#BCEBDB

Nhãn, ô số liệu, lựa chọn đang chọn. CMS: Màu phụ

San hô

#F2674F

Nét cười dưới chữ nhấn, sao, chấm nhãn. CMS: Màu nhấn

Bạc hà loãng

phụ 42% trên nền

Tự tính

San hô loãng

nhấn 13% trên nền

Tự tính

Thang chữ

Hero

Tinh tế trong từng chi tiết

Fraunces 450 · 42→82px · -2.8%

H2

Tinh tế trong từng chi tiết

Fraunces 450 · 32→53px · -2.4%

H3

Tinh tế trong từng chi tiết

Fraunces 500 · 22px

Dẫn

Tinh tế trong từng chi tiết

Jakarta 400 · 17px · dòng 1.65

Thân

Tinh tế trong từng chi tiết

Jakarta 400 · 15.5→16.5px

Nhãn

Tinh tế trong từng chi tiết

Jakarta 600 · 12.8px · viên nang bạc hà

Bo góc

  • Nút, chip, ô giờ999px (viên nang)
  • Thẻ, ô số liệu28px
  • Khung ảnh nụ cười28px trên, 50% / 13% dưới
  • Ô nhập16px

Khoảng cách

  • Khung nội dung1152px, lề 20→32px
  • Khoảng section64px → 96px
  • Lưới12 cột, khe 16–64px

Chuyển động

Hiện dần 600ms: mờ → rõ, nhô 18px với nhịp nảy nhẹ cubic-bezier(.34,1.32,.64,1). Nét cười dưới chữ nhấn tự vẽ từ trái sang khi cuộn tới. Nút nhô 2px khi rê, mũi tên trong chấm tròn nhích sang. Thanh tiến trình đặt lịch trượt viên nang theo bước.

Thành phần

Nút viên nang
Đặt lịch khám Hỏi bác sĩ Xem bảng giá Tất cả dịch vụ
Nhãn, chip thời lượng và giá
Nha khoa gia đình 45 phút 300.000 – 500.000đ Phút 10
Tiêu đề có nét cười

Đi nha sĩ mà vẫn nhẹ tênh

Ô nhập và ô giờ
08:00 09:30 10:15 11:00
Hội thoại trấn an

Em sợ mũi tiêm tê lắm.

Mình bôi tê trước rồi dùng bút không kim, gần như không thấy gì.

Khung ảnh nụ cười + chip nổi

Giơ tay là bác sĩ dừng

Tham chiếu 21st.dev

Đặt lịch khám