Bộ chọn và chuyển đổi màu

Chọn màu trực quan và chuyển đổi giữa các định dạng HEX, RGBA, HSLA, HSV/HSB và CMYK.

Thêm về mô hình màu

Mô hình màu

Mô hình màu là hệ thống mô tả màu sắc dưới dạng số. Các mô hình khác nhau được sử dụng trong các ngữ cảnh khác nhau tùy thuộc vào đầu ra là màn hình, máy in hay đặc tả thiết kế.

RGB / RGBA
Định dạng

RGB định nghĩa màu bằng cách trộn ánh sáng đỏ, xanh lá cây và xanh dương. Mỗi kênh nằm trong khoảng từ 0 đến 255. rgb(255, 0, 0) là đỏ thuần. rgb(255, 255, 255) là trắng. Kênh A (alpha) thêm độ trong suốt, nằm trong khoảng từ 0 (hoàn toàn trong suốt) đến 1 (hoàn toàn mờ đục). Ví dụ: rgba(255, 0, 0, 0.5) là đỏ bán trong suốt. RGB là mô hình màu gốc cho màn hình và hiển thị kỹ thuật số.

Lịch sử

Mô hình RGB bắt nguồn từ lý thuyết thị giác ba màu Young-Helmholtz từ thế kỷ 19. James Clerk Maxwell đã tiến hành các thí nghiệm chụp ảnh màu RGB đầu tiên vào năm 1861. RGB trở thành tiêu chuẩn cho màn hình điện tử với sự phát triển của tivi CRT màu trong những năm 1930 và 1940, và sau đó được áp dụng cho màn hình máy tính. Không gian màu sRGB đã được chính thức áp dụng làm tiêu chuẩn web trong HTML 3.2 vào tháng 1 năm 1997.

HEX / HEXA
Định dạng

HEX là ký hiệu rút gọn cho giá trị RGB sử dụng thập lục phân. #FF0000 giống với rgb(255, 0, 0). Mỗi cặp chữ số hex đại diện cho một kênh: #RRGGBB. Dạng 8 chữ số #RRGGBBAA thêm kênh alpha, trong đó 00 hoàn toàn trong suốt và FF hoàn toàn mờ đục. Ví dụ: #FF000080 là đỏ ở độ mờ 50%. Dạng rút gọn như #F00 mở rộng thành #FF0000.

Lịch sử

Ký hiệu màu hex bắt nguồn từ các trình duyệt web đầu tiên vào giữa những năm 1990. Các phiên bản đầu tiên của Mosaic và Netscape Navigator kế thừa hệ thống tên màu X11. CSS Level 1, được xuất bản vào tháng 12 năm 1996 bởi Hakon Wium Lie và Bert Bos, đã chính thức chuẩn hóa bộ ba hex như cách chính để chỉ định màu trên web.

HSL / HSLA
Định dạng

HSL mô tả màu dưới dạng sắc độ, độ bão hòa và độ sáng. Sắc độ là một độ trên bánh xe màu (0-360): 0 là đỏ, 120 là xanh lá cây, 240 là xanh dương. Độ bão hòa (0-100%) kiểm soát cường độ màu. Độ sáng (0-100%) kiểm soát độ tươi, trong đó 0% là đen và 100% là trắng. HSL thường trực quan hơn RGB để chọn màu vì bạn có thể điều chỉnh độ sáng và độ bão hòa một cách độc lập.

Lịch sử

HSL lần đầu được mô tả bởi George H. Joblove và Donald Greenberg trong bài báo năm 1978 trên Computer Graphics. Nó được tạo ra để giải quyết vấn đề cơ bản với RGB: trộn các giá trị đỏ, xanh lá cây và xanh dương không trực quan cho con người. HSL sắp xếp lại không gian màu RGB để các nghệ sĩ và nhà thiết kế có thể suy nghĩ theo màu sắc (sắc độ), độ tươi (độ bão hòa) và độ sáng, phù hợp hơn với cách mọi người tự nhiên mô tả màu sắc.

HSV / HSB
Định dạng

HSV (sắc độ, độ bão hòa, giá trị) tương tự HSL nhưng sử dụng "giá trị" (độ sáng) thay vì độ sáng. Ở 100% giá trị, các màu bão hòa hoàn toàn là thuần và tươi. HSV ánh xạ tự nhiên hơn với cách bộ chọn màu hoạt động: bảng độ bão hòa/độ sáng điều chỉnh S và V trong khi thanh trượt sắc độ điều chỉnh H.

Lịch sử

HSV được mô tả bởi Alvy Ray Smith vào tháng 8 năm 1978 khi đang làm việc tại Phòng thí nghiệm Đồ họa Máy tính của Viện Công nghệ New York. Nó được xuất bản cùng số của Computer Graphics với HSL. Smith đã thiết kế HSV để sử dụng trong chương trình vẽ kỹ thuật số đầu tiên, nơi các nghệ sĩ cần cách trực quan để chọn màu trên màn hình. Mô hình hình trụ của HSV giúp triển khai tự nhiên như bộ chọn màu với thanh trượt sắc độ và bảng độ bão hòa/độ sáng.

CMYK
Định dạng

CMYK (lục lam, đỏ tươi, vàng, đen) được sử dụng trong in ấn. Trong khi RGB là cộng (ánh sáng), CMYK là trừ (mực). Mỗi giá trị đại diện cho phần trăm mực được áp dụng. cmyk(0, 100, 100, 0) tạo ra đỏ. Chuyển đổi giữa RGB và CMYK là gần đúng vì chúng bao phủ các dải màu (gamut) khác nhau.

Lịch sử

Nền tảng của CMYK có từ Jacob Christoph Le Blon, người đã phát minh in màu bán sắc sử dụng các bản đồng riêng biệt khoảng năm 1710. Ông ban đầu sử dụng các bản đỏ, vàng và xanh, và sau đó thêm bản đen cho đường viền và văn bản sắc nét hơn. Quy trình bốn màu CMYK hiện đại lần đầu được triển khai vào những năm 1890 cho minh họa báo chí màu. Bản đen được gọi là bản "key" vì nó mang chi tiết tinh tế mà các bản khác được căn chỉnh (keyed) theo.

Định dạng màu CSS

CSS hiện đại hỗ trợ nhiều ký hiệu màu:

  • #FF5733 hoặc #ff5733 (HEX)
  • rgb(255, 87, 51) hoặc rgba(255, 87, 51, 0.5)
  • hsl(14, 100%, 60%) hoặc hsla(14, 100%, 60%, 0.5)
  • Màu có tên: red, cornflowerblue, rebeccapurple (tổng cộng 148 màu có tên)