Color Models

HSL

Mô hình màu hình trụ mô tả màu sắc qua sắc màu, độ bão hòa và độ sáng, được thiết kế trực quan để người dùng dễ chọn màu.

HSL represents color as an angle on the color wheel (hue, 0-360), a percentage of color intensity (saturation, 0-100%), and a percentage of lightness (0-100% where 0% is black and 100% is white). At 50% lightness, the pure hue is displayed. HSL is widely used in CSS (the hsl() function) because it makes it easy to create tints, shades, and tones by adjusting a single parameter. It is more intuitive than RGB for design work but has the limitation of not being perceptually uniform, meaning equal numeric changes do not always produce equal visual changes.

Dùng thử

Chuyển đổi màu sắc

Chuyển đổi tức thì giữa các định dạng màu HEX, RGB, HSL, HSV, CMYK và OKLCH.

Bài viết liên quan

CSS color-mix(): Pha Trộn Màu Natively Trong Trình Duyệt

Học CSS color-mix() để pha trộn màu natively trong trình duyệt. Cú pháp, không gian màu và tạo bảng màu động không cần JavaScript.

Xây Dựng Color Picker Web Component Từ Đầu

Xây dựng color picker dễ tiếp cận như một Web Component. Triển khai canvas rendering, thanh trượt hue, kênh alpha và custom events với Shadow DOM.

Không Gian Màu Nhận Thức: Lab, LCH, Oklab, OKLCH

Không gian màu đồng đều nhận thức—CIE Lab, LCH, Oklab và OKLCH. Cách thiết kế, ưu điểm và nên dùng cái nào cho CSS và thiết kế.

Emerald vs Jade vs Forest Green: Hướng Dẫn So Sánh Màu Xanh Lá

So sánh emerald (#50C878), jade (#00A86B) và forest green (#228B22). Tìm hiểu sự khác biệt thị giác và hex code giữa các sắc xanh lá phổ biến này.

Sự Khác Biệt Giữa Cyan và Turquoise

Cyan (#00FFFF) và turquoise (#40E0D0) trông giống nhau nhưng khác về vị trí trong mô hình màu, saturation và trường hợp sử dụng. Đây là phân tích đầy đủ.

Thiết kế API Màu sắc: REST Endpoints cho Dữ liệu Màu

Thiết kế một RESTful API màu sắc với các endpoints để chuyển đổi màu, tìm kiếm, kiểm tra độ tương phản và tạo bảng màu. Tìm hiểu thiết kế schema và các thực hành tốt nhất.