02 · Logo

Logo

Năm biến thể, một quy tắc: không sửa logo — chọn biến thể đúng cho nền.

Biến thể

Logo chính
nền sáng · primary.svg · 2 KB

Biểu tượng (mark)
favicon, avatar, cỡ nhỏ · mark.svg · 1 KB

Chữ (wordmark)
khi mark đã xuất hiện gần đó · wordmark.svg · 2 KB

Một màu
in khắc, dập nổi, nền ảnh · mono.svg · 2 KB

Trên nền tối
nền tối · on-dark.svg · 2 KB

0.5 × chiều cao mark (32/64) — tương đương 8 ô pixel

mark 16px · logo đầy đủ 104px ngang

Đừng làm những điều này với logo.

01 **Kéo méo tỉ lệ** — ô pixel phải vuông; luôn khoá tỉ lệ khi đổi cỡ. ![Kéo méo](misuse/stretch.svg)

02 **Đổi màu ngoài design-system** — ô logo luôn là Tím số, mầm luôn là Lá chuối, que đo luôn là Cà chua. ![Đổi màu](misuse/recolor.svg)

03 **Đổ bóng mờ, phát sáng, hiệu ứng 3D** — logo là sprite phẳng, không thêm bóng mờ. ![Đổ bóng](misuse/shadow.svg)

04 **Xoay logo** — lưới pixel chỉ đứng thẳng; xoay làm vỡ ô vuông. ![Xoay](misuse/rotate.svg)

05 **Đặt trên nền rối hoặc tương phản thấp** — dùng nền Giấy lúa, trắng hoặc Mực đêm. ![Nền rối](misuse/busy-bg.svg)

06 **Thêm viền quanh ô logo** — 4 góc khuyết đã là đường viền của sprite, không viền thêm. ![Thêm viền](misuse/outline.svg)

07 **Lấn vùng an toàn** — giữ khoảng trống ≥ 0.5 × chiều cao mark (8 ô pixel) quanh logo. ![Vùng an toàn](misuse/clearspace.svg)

08 **Làm mịn, bo tròn ô pixel** hoặc vẽ lại mầm bằng đường cong — mark chỉ dựng trên lưới 16×16 ô.