color/

Không gõ được tên màu, sẽ báo "Không nhận dạng được định dạng". Các cách viết được hỗ trợ là HEX (3, 4, 6, 8 chữ số, có thể bỏ dấu #), rgb() / rgba(), hsl() / hsla() và oklch(); đối số có thể ngăn cách bằng dấu phẩy, hoặc dùng dấu cách rồi viết độ mờ đục sau dấu gạch chéo (ví dụ rgb(255 0 0 / 50%)); sắc độ (hue) của HSL có thể kèm đơn vị deg, rad, grad, turn. Kết quả xuất ra luôn là bốn dạng HEX, RGB, HSL, OKLCH, không có CMYK và HSV.

Nằm ở hai chữ số cuối, viết là #RRGGBBAA, giống với CSS. Dạng #AARRGGBB thường gặp trên Android đặt độ mờ đục ở đầu, nên trước khi dán vào cần chuyển hai chữ số đầu xuống cuối. Hai chữ số thập lục phân chỉ có 256 mức, vì vậy 80 (128 ở hệ thập phân) quy đổi ra 0.502 chứ không phải con số tròn 0.5; chiều ngược lại, nhập độ mờ đục 0.5 thì HEX xuất ra sẽ kết thúc bằng 80.

Khi màu vượt ngoài phạm vi sRGB có thể hiển thị, công cụ cắt riêng từng kênh đỏ, lục, lam về trong phạm vi hợp lệ và xuất ra màu sau khi cắt. Giá trị trong rgb() lớn hơn 255, hoặc độ bão hòa hay độ sáng của HSL lớn hơn 100% sẽ bị cắt âm thầm, không báo gì; chỉ OKLCH mới báo "Vượt ngoài gam màu sRGB", vì nó biểu diễn được những màu rực rỡ hơn sRGB. Khi đó OKLCH trong kết quả được tính lại từ màu đã cắt nên khác với số bạn nhập. Trên màn hình gam màu rộng, viết thẳng oklch() trong CSS có thể rực rỡ hơn bản xem trước ở đây.

Công cụ này chỉ tính độ tương phản giữa màu bạn nhập với trắng tinh và đen tuyền, tức là coi nó là màu chữ đặt lần lượt trên nền trắng và nền đen, không chọn được màu nền khác. Thuật toán theo WCAG 2.x: đổi từng kênh sRGB sang giá trị tuyến tính, nhân với trọng số 0.2126, 0.7152, 0.0722 để ra độ sáng tương đối L, rồi độ tương phản = (L của màu sáng hơn + 0.05) ÷ (L của màu tối hơn + 0.05). Với hai màu bất kỳ khác, bạn tự áp dụng cùng công thức này.

AA và AAA là hai mức tuân thủ độ tương phản của chữ theo WCAG, trong đó AAA nghiêm ngặt hơn. Với chữ thường, AA cần đạt 4.5 : 1 và AAA cần 7 : 1; với chữ lớn, AA là 3 : 1 và AAA là 4.5 : 1. Công cụ ghi "đạt" hoặc "không đạt" cho từng mục. "Chữ lớn" là chữ từ 18pt (khoảng 24px) trở lên, hoặc chữ đậm từ 14pt (khoảng 18.7px) trở lên. Khi làm web, thường lấy AA làm mục tiêu.

Màu trước tiên được phủ lên nền theo độ mờ đục, rồi mới tính độ tương phản. Dòng "Trên nền trắng" phủ lên trắng tinh, dòng "Trên nền đen" phủ lên đen tuyền, nên cùng một màu bán trong suốt nhưng màu thực sự tham gia tính toán ở hai dòng là khác nhau. Nếu nền thật trong trang của bạn không phải trắng hay đen tuyền thì kết quả sẽ khác, bạn cần tự kiểm tra lại.

Không. Bộ chọn màu là điều khiển có sẵn của trình duyệt, chỉ chọn được màu HEX 6 chữ số không có độ mờ đục. Sau khi chọn màu bằng nó, ô nhập sẽ bị thay bằng #rrggbb và độ mờ đục cũ mất đi; muốn màu bán trong suốt, hãy gõ thẳng HEX 8 chữ số hoặc rgb(255 0 0 / 50%) vào ô nhập. Khi ô nhập đang chứa màu bán trong suốt, bộ chọn màu cũng chỉ hiển thị phần đặc của nó.

Sao chép rồi dán vào khối :root là dùng được. Bốn dòng lần lượt là HEX, ba số R G B cách nhau bằng dấu cách, ba giá trị H S L và oklch() đầy đủ. Trong đó --color-rgb và --color-hsl không chứa độ mờ đục, nên bạn có thể viết như rgb(var(--color-rgb) / 50%) để chỉnh độ mờ đục tại chỗ; cách viết dấu cách kèm gạch chéo này cần trình duyệt khá mới. Khi bản thân màu có độ mờ đục, chỉ --color và --color-oklch mới mang theo nó.