Color picker online - Công cụ lấy mã màu online 2025
Chọn mã màu:
Hoặc nhập:
Hoặc chọn:
Màu đã chọn:
Black Text
Shadow
White Text
Shadow
Lighter / Darker:
100% | #ffffff | |
95% | #ffe6f0 | |
90% | #ffcce0 | |
85% | #ffb3d1 | |
80% | #ff99c2 | |
75% | #ff80b3 | |
70% | #ff66a3 | |
65% | #ff4d94 | |
60% | #ff3385 | |
55% | #ff1a75 | |
50% | #ff0066 | |
45% | #e6005c | |
40% | #cc0052 | |
35% | #b30047 | |
30% | #99003d | |
25% | #800033 | |
20% | #660029 | |
15% | #4d001f | |
10% | #330014 | |
5% | #1a000a | |
0% | #000000 |
Hue
Hue là tổ hợp 12 màu đậm nhạt khác nhau trên bánh xe màu sắc (color wheel). Hue đóng vai trò như một yếu tố căn bản trong màu sắc. Nó có thể được chuyển hoá thành ba dạng khác nhau: Tint (Sắc thái màu), Shade (Đổ bóng), Tone (Tông màu).
Tint thường được tạo ra bằng cách hoà trộn Hue với màu trắng
Shade thì là hỗn hợp giữa Hue và màu đen.
hue | Hex | Rgb | Hsl | |
0 | #ff0000 | rgb(255, 0, 0) | hsl(0, 100%, 50%) | |
15 | #ff4000 | rgb(255, 64, 0) | hsl(15, 100%, 50%) | |
30 | #ff8000 | rgb(255, 128, 0) | hsl(30, 100%, 50%) | |
45 | #ffbf00 | rgb(255, 191, 0) | hsl(45, 100%, 50%) | |
60 | #ffff00 | rgb(255, 255, 0) | hsl(60, 100%, 50%) | |
75 | #bfff00 | rgb(191, 255, 0) | hsl(75, 100%, 50%) | |
90 | #80ff00 | rgb(128, 255, 0) | hsl(90, 100%, 50%) | |
105 | #40ff00 | rgb(64, 255, 0) | hsl(105, 100%, 50%) | |
120 | #00ff00 | rgb(0, 255, 0) | hsl(120, 100%, 50%) | |
135 | #00ff40 | rgb(0, 255, 64) | hsl(135, 100%, 50%) | |
150 | #00ff80 | rgb(0, 255, 128) | hsl(150, 100%, 50%) | |
165 | #00ffbf | rgb(0, 255, 191) | hsl(165, 100%, 50%) | |
180 | #00ffff | rgb(0, 255, 255) | hsl(180, 100%, 50%) | |
195 | #00bfff | rgb(0, 191, 255) | hsl(195, 100%, 50%) | |
210 | #0080ff | rgb(0, 128, 255) | hsl(210, 100%, 50%) | |
225 | #0040ff | rgb(0, 64, 255) | hsl(225, 100%, 50%) | |
240 | #0000ff | rgb(0, 0, 255) | hsl(240, 100%, 50%) | |
255 | #4000ff | rgb(64, 0, 255) | hsl(255, 100%, 50%) | |
270 | #8000ff | rgb(128, 0, 255) | hsl(270, 100%, 50%) | |
285 | #bf00ff | rgb(191, 0, 255) | hsl(285, 100%, 50%) | |
300 | #ff00ff | rgb(255, 0, 255) | hsl(300, 100%, 50%) | |
315 | #ff00bf | rgb(255, 0, 191) | hsl(315, 100%, 50%) | |
330 | #ff0080 | rgb(255, 0, 128) | hsl(330, 100%, 50%) | |
336 | #ff0066 | rgb(255, 0, 102) | hsl(336, 100%, 50%) | |
345 | #ff0040 | rgb(255, 0, 64) | hsl(345, 100%, 50%) | |
360 | #ff0000 | rgb(255, 0, 0) | hsl(0, 100%, 50%) |
Saturation
Saturation là độ rực màu hoặc độ bão hòa của màu, nó còn được hiểu là mức độ sử dụng của một màu nhất định nhiều hay ít. Như vậy, nếu như bạn sử dụng màu nào đó với mức độ nhiều thì độ Saturation cũng tăng lên.
sat | Hex | Rgb | Hsl | |
100% | #ff0066 | rgb(255, 0, 102) | hsl(336, 100%, 50%) | |
95% | #f90667 | rgb(249, 6, 103) | hsl(336, 95%, 50%) | |
90% | #f20d69 | rgb(242, 13, 105) | hsl(336, 90%, 50%) | |
85% | #ec136a | rgb(236, 19, 106) | hsl(336, 85%, 50%) | |
80% | #e6196b | rgb(230, 25, 107) | hsl(336, 80%, 50%) | |
75% | #df206c | rgb(223, 32, 108) | hsl(336, 75%, 50%) | |
70% | #d9266e | rgb(217, 38, 110) | hsl(336, 70%, 50%) | |
65% | #d22d6f | rgb(210, 45, 111) | hsl(336, 65%, 50%) | |
60% | #cc3370 | rgb(204, 51, 112) | hsl(336, 60%, 50%) | |
55% | #c63971 | rgb(198, 57, 113) | hsl(336, 55%, 50%) | |
50% | #bf4073 | rgb(191, 64, 115) | hsl(336, 50%, 50%) | |
45% | #b94674 | rgb(185, 70, 116) | hsl(336, 45%, 50%) | |
40% | #b34d75 | rgb(179, 77, 117) | hsl(336, 40%, 50%) | |
35% | #ac5377 | rgb(172, 83, 119) | hsl(336, 35%, 50%) | |
30% | #a65978 | rgb(166, 89, 120) | hsl(336, 30%, 50%) | |
25% | #9f6079 | rgb(159, 96, 121) | hsl(336, 25%, 50%) | |
20% | #99667a | rgb(153, 102, 122) | hsl(336, 20%, 50%) | |
15% | #936c7c | rgb(147, 108, 124) | hsl(336, 15%, 50%) | |
10% | #8c737d | rgb(140, 115, 125) | hsl(336, 10%, 50%) | |
5% | #86797e | rgb(134, 121, 126) | hsl(336, 5%, 50%) | |
0% | #808080 | rgb(128, 128, 128) | hsl(336, 0%, 50%) |
Lightness
light | Hex | Rgb | Hsl | |
100% | #ffffff | rgb(255, 255, 255) | hsl(336, 100%, 100%) | |
95% | #ffe6f0 | rgb(255, 230, 240) | hsl(336, 100%, 95%) | |
90% | #ffcce0 | rgb(255, 204, 224) | hsl(336, 100%, 90%) | |
85% | #ffb3d1 | rgb(255, 179, 209) | hsl(336, 100%, 85%) | |
80% | #ff99c2 | rgb(255, 153, 194) | hsl(336, 100%, 80%) | |
75% | #ff80b3 | rgb(255, 128, 179) | hsl(336, 100%, 75%) | |
70% | #ff66a3 | rgb(255, 102, 163) | hsl(336, 100%, 70%) | |
65% | #ff4d94 | rgb(255, 77, 148) | hsl(336, 100%, 65%) | |
60% | #ff3385 | rgb(255, 51, 133) | hsl(336, 100%, 60%) | |
55% | #ff1a75 | rgb(255, 26, 117) | hsl(336, 100%, 55%) | |
50% | #ff0066 | rgb(255, 0, 102) | hsl(336, 100%, 50%) | |
45% | #e6005c | rgb(230, 0, 92) | hsl(336, 100%, 45%) | |
40% | #cc0052 | rgb(204, 0, 82) | hsl(336, 100%, 40%) | |
35% | #b30047 | rgb(179, 0, 71) | hsl(336, 100%, 35%) | |
30% | #99003d | rgb(153, 0, 61) | hsl(336, 100%, 30%) | |
25% | #800033 | rgb(128, 0, 51) | hsl(336, 100%, 25%) | |
20% | #660029 | rgb(102, 0, 41) | hsl(336, 100%, 20%) | |
15% | #4d001f | rgb(77, 0, 31) | hsl(336, 100%, 15%) | |
10% | #330014 | rgb(51, 0, 20) | hsl(336, 100%, 10%) | |
5% | #1a000a | rgb(26, 0, 10) | hsl(336, 100%, 5%) | |
0% | #000000 | rgb(0, 0, 0) | hsl(336, 100%, 0%) |
RGB (Red, Green, Blue)
Red | Green | Blue |
---|---|---|
255 | 0 | 102 |
#ff0066
Trên đây là công cụ giúp bạn chọn nhanh mã màu mà bạn yêu thích bằng cách click vào phần bản đồ màu ở công cụ lấy màu trên, tiếp đó bạn sẽ nhận được mã màu hex, rgb và hsl ở cột bên cạnh. Ngoài ra công cụ này còn tạo tự động danh sách các màu sắc sáng hơn (lighter) và màu sắc tối hơn (darker) để bạn có thêm lựa chọn cho nhu cầu lấy màu của bạn. Nếu bạn không tự chọn được màu đẹp, hãy tham khảo ngay bảng mã màu đẹp 2025 với hơn 6400+ mã màu đẹp nhất.
công cụ lấy mã màu online, color picker online, phần mềm lấy mã màu, công cụ lấy màu color picker, color picker tools
Nguồn: https://tienichhay.net/color-picker.html
Nhóm tiện ích Online Để thảo luận, góp ý, báo lỗi hoặc yêu cầu tiện ích mới