Tin tức và phân tích của tất cả các thiết bị di động

Mã màu: Điều gì khác biệt giữa Hex, RGB và HSL?

Mã màu: Điều gì khác biệt giữa Hex, RGB và HSL?

Khi nói đến màu sắc rực rỡ trên màn hình, có một vài cách để làm điều đó với mã hóa. Hex, RGBA và HSLA là ba trong số các hệ thống mã màu được sử dụng phổ biến nhất.

Bạn có thể bắt gặp các mã hex và RGB trong quá khứ, nhưng HSL, mặc dù dễ đọc hơn cho con người, có thể chưa có trên radar của bạn. Mỗi cách viết màu xuống có ý nghĩa trong các tình huống khác nhau, và tất cả những gì bạn cần là một sự hiểu biết cơ bản về từng loại để đưa ra quyết định sáng suốt. Ở đây chúng tôi sẽ giải thích sự khác biệt giữa RGB, HEX và HSL.

RGB là gì (Đỏ, Xanh lục, Xanh lam)

Mô hình màu Rgb

Nó có ý nghĩa để bắt đầu với các giá trị RGB, vì Màu đỏ, màu xanh láMàu xanh da trời là ba màu mà màn hình có thể sử dụng để tạo ra khá nhiều màu khác. Nó thực hiện điều này bằng cách sử dụng pha trộn màu phụ gia, nhưng bạn không thể đi sâu vào khoa học để hiểu về RGB.

Mô hình màu Rgba

rgb (255, 0, 0) là màu đỏ, vì R được max. Nếu bạn đặt G hoặc B thành 255, bạn sẽ có màu xanh lá cây hoặc xanh dương đầy đủ. Đặt tất cả chúng thành 255 cùng một lúc và bạn sẽ có màu trắng (tổng của tất cả các màu), trong khi zeroing chúng làm cho màu đen. Nếu bạn thêm một giá trị thứ tư (kênh alpha, giữa 0 đến 1) bạn cũng có thể có được sự minh bạch: rgba (0, 0, 0,.5) dịch sang một nửa màu đen trong suốt.

Nó đơn giản, có, nhưng không thực sự trực quan. Cân bằng RGB có thể thay đổi khá nhiều ngay cả khi bạn chỉ thay đổi sắc độ của màu, khiến con người rất khó điều chỉnh thủ công mà không có một loại máy phát RGB nào (may mắn thay, có rất nhiều).

Mã màu thập lục phân là gì

Mô hình màu Hex trong suốt

Hexes chỉ là một cách khác nhau để viết các giá trị RGB. Một cái gì đó như # 6a79f7 (màu xanh hoa ngô) ánh xạ trực tiếp đến rgb (106, 121, 247). 6a là màu đỏ, 79 là màu xanh lávà f7 là màu xanh da trời.

Trước tiên, bạn nên biết rằng trong hệ thống màu lục giác, các chữ cái Chữ a-f-tượng trưng cho các số từ mười đến mười lăm. Thứ hai, nó là thập lục phân, nghĩa là mọi thứ đều ở cơ sở 16. 21 là 2 * 10 + 1 trong cơ sở 10, nhưng trong thập lục phân, nó sẽ là 2 * 16 + 1. Chỉ cần nhân số thứ nhất với 16 và thêm số thứ hai – thật dễ dàng như thế! 6a = 6 * 16 + 10 hoặc 106. 79 = 7 * 16 + 9 hoặc 121.

Mô hình màu Hex Biểu đồ

Mặc dù toán học rất thú vị, nhưng rõ ràng nó tạo ra các mã thập lục phân thậm chí còn gây đau đớn hơn cho con người so với RGB, mặc dù chúng rất dễ sao chép-dán và có thể có các kết hợp chữ / số đáng nhớ.

Bạn cũng có thể thêm độ trong suốt cho mã hex bằng cách đặt một giá trị tương đương với một số phần trăm 255 ở đầu, như vậy: # 806a79f7. 80 trong thập lục phân = 126, gần bằng 50% giá trị tối đa 255.

HSL là gì (Huế, Saturation, Lightness)

Mô hình màu Hsl

HSL được thiết kế khá nhiều cho khả năng đọc của con người, và nó trở nên phổ biến, đặc biệt là một giải pháp thay thế RGB. Nó hoạt động như thế này:

Huế có nghĩa là màu sắc và nó sử dụng độ của bánh xe màu để cho bạn biết màu sắc của bạn trên màu gì. Nếu bạn biết bánh xe màu và vị trí của các màu chính này, bạn sẽ có thể nói rằng 45 sẽ có màu cam và 270 sẽ có màu tím chỉ bằng cách nghĩ về nó trong một giây.

Bánh xe màu Rgb

    0 = đỏ60 = vàng120 = xanh180 = cyan240 = xanh300 = đỏ tươi

Độ bão hòa về cơ bản là màu sắc như thế nào. 0% bão hòa có nghĩa là màu sẽ chỉ là một màu xám, trong khi 100% có nghĩa là nó sẽ hiển thị đầy đủ sức mạnh. Nếu bạn muốn tắt tiếng màu của bạn hoặc làm cho nó nổi hơn một chút, bạn có thể thay đổi giá trị này.

Nhẹ nhàng cho bạn biết màu tối hay sáng như thế nào 0% độ sáng có nghĩa là màu của bạn sẽ là màu đen, bất kể cài đặt Hue hay Saturation và độ sáng 100% sẽ giúp bạn có màu trắng. Như bạn có thể đoán, 50% cho bạn màu chính xác nhất.

Mô hình màu Hsla

Với thông tin đó, bạn sẽ có thể biết ngay hsl là gì (0, 100%, 50%) có nghĩa. Nó chỉ màu đỏ! Bạn muốn một màu đỏ đậm hơn, phong phú hơn? Thử 0, 70%, 40%. Có thể bạn muốn điều đó, nhưng trong màu xanh? Chỉ là sự thay đổi 0 đến 240 và bạn đã có nó! Nó cũng có độ trong suốt – nó hoạt động giống như RGB: chỉ cần thêm giá trị thứ tư (giữa 0 và 1), như vậy: hsla (240, 70%, 40%,.5).

HSV / HSB và HSI

Mô hình màu Hsv

Gì? Nhiều mô hình màu? Cho đến khi mọi thứ kết thúc? Đối với hầu hết những người làm việc với màu sắc trên máy tính, nó đã kết thúc. Hex, RGB và HSL là những cách phổ biến nhất để ghi chú màu sắc. Tuy nhiên, nếu bạn trong một lĩnh vực liên quan đến nhiều hình ảnh và màu sắc, như thiết kế đồ họa hoặc học máy trên hình ảnh, bạn có thể chạy ngang qua mọi người bằng cách sử dụng một trong những mô hình màu bí truyền hơn hoặc thậm chí một trong những mô hình khác không được liệt kê ở đây.

HSB là viết tắt của Độ sáng Độ bão hòa Huế Huế và HSV là viết tắt của Giá trị bão hòa Huế. Họ thực sự chỉ là những cái tên khác nhau cho cùng một mô hình và sự khác biệt lớn nhất của họ với HSL là ở cách họ xác định độ bão hòa. HSI (Hue Saturation Cường độ) có một vài điểm khác biệt nhỏ so với HSB / HSV, nhưng nó không được sử dụng rộng rãi, vì vậy tỷ lệ cược là bạn sẽ thấy nó trong tự nhiên rất nhiều.

Tôi nên sử dụng mô hình màu nào?

Nói chung, chọn một mô hình màu là một quyết định thiết kế khá nhỏ, nhưng những điều tốt được thực hiện với nhiều quyết định nhỏ. Nói chung, mã hex làm cho việc sao chép dễ dàng và rất tuyệt vời trong các tình huống mà con người có thể giành chiến thắng có thể tham gia rất nhiều. RGB / RGBA phù hợp với khả năng đọc và được sử dụng tốt nhất khi thật tuyệt nếu con người đôi khi có thể điều chỉnh độ trong suốt. Nếu con người sẽ cần thay đổi màu thủ công, hãy đi với HSL / HSLA. Ngoài ra, nó còn khá nhiều vấn đề ưu tiên, mặc dù những người trong nhóm HSL thường có xu hướng thông minh hơn và dễ nhìn hơn.

Tín dụng hình ảnh: HSL Màu sắc xi lanh rắn Saturation Xám, Màu phụ gia, Bảng màu của XTerm, HSL và HSV, Munsell 1943

Bài viết này có hữu ích không? Có không

Mục lục