Bảng Màu Online: Tra Mã HEX, RGB, Gradient, HTML, CSS

Tham khảo app: Chuyển chữ HOA=chữ thường

Các Loại Mã Code Màu Và Cách Dùng

Mã màu trong lập trình web và thiết đồ họa, in được biểu diễn bằng nhiều hệ khác nhau. Dưới đây là thông số các loại mã màu phổ biến cùng cách sử dụng:

1️⃣ Mã Màu HEX (Hexadecimal)

📌 Định dạng: #RRGGBB (Ví dụ: #FF5733)
📌 Cách dùng: Mã HEX dùng phổ biến trong HTML, CSS.

✅ Ví dụ trong CSS:

body {
    background-color: #FF5733; /* Màu cam */
}

✅ Ví dụ trong HTML:

<p style="color: #3498DB;">Màu chữ xanh dương</p>

2️⃣ Mã Màu RGB (Red, Green, Blue)

📌 Định dạng: rgb(R, G, B) (Ví dụ: rgb(255, 87, 51))
📌 Cách dùng: Dùng trong CSS, JavaScript, thiết kế đồ họa.

✅ Ví dụ trong CSS:

h1 {
    color: rgb(255, 87, 51); /* Màu cam */
}

✅ Ví dụ trong JavaScript:

document.body.style.backgroundColor = "rgb(0, 255, 150)";

3️⃣ Mã Màu RGBA (RGB + Alpha – Độ trong suốt)

📌 Định dạng: rgba(R, G, B, A) (A là độ trong suốt từ 0.0 đến 1.0)
📌 Cách dùng: Dùng trong CSS khi cần hiệu ứng trong suốt.

✅ Ví dụ trong CSS:

div {
    background-color: rgba(255, 87, 51, 0.5); /* Màu cam, 50% trong suốt */
}

4️⃣ Mã Màu HSL (Hue, Saturation, Lightness)

📌 Định dạng: hsl(H, S%, L%) (Ví dụ: hsl(0, 100%, 50%))
📌 Cách dùng: Dễ hiểu hơn RGB khi điều chỉnh độ sáng, độ bão hòa.

✅ Ví dụ trong CSS:

p {
    color: hsl(200, 100%, 50%); /* Màu xanh dương */
}

5️⃣ Mã Màu HSLA (HSL + Alpha – Độ trong suốt)

📌 Định dạng: hsla(H, S%, L%, A) (A từ 0.0 đến 1.0)
📌 Cách dùng: Giống HSL nhưng có thêm độ trong suốt.

✅ Ví dụ trong CSS:

span {
    background-color: hsla(0, 100%, 50%, 0.3); /* Đỏ nhạt 30% */
}

🔎 Khi Nào Dùng Loại Mã Màu Nào?

Chia sẽ ứng dụng: App Tính Tuổi Thai Online MIỄN PHÍ

3 Cách Tra Mã Màu Từ Ảnh

Ngoài dùng công cụ check bảng màu, bạn có thể tra mã màu từ ảnh PNG, GIF, TIFF, JPEG và JPG… bằng nhiều cách khác nhau, tùy theo bạn sử dụng máy tính hay điện thoại. Dưới đây là các phương pháp tra code màu đơn giản:

Dùng Công Cụ Online (Nhanh & Dễ)

Các trang web giúp bạn tải ảnh lên và check lấy mã màu từ ảnh ngay lập tức:

• 🎨 Image Color Picker: https://imagecolorpicker.com
• 🎨 HTML Color Codes: https://htmlcolorcodes.com/color-picker/
• 🎨 Color Hex: https://www.colorhexa.com

Cách làm:

1. Truy cập 1 trong các trang trên.
2. Tải ảnh lên hoặc dán link ảnh.
3. Chọn vị trí màu bạn muốn lấy.
4. Mã màu HEX, RGB sẽ hiện ra.

Dùng Photoshop hoặc Paint (PC)

• Photoshop:
  1. Mở ảnh bằng Photoshop.
  2. Chọn Công cụ Eyedropper (I).
  3. Nhấp vào vùng màu bạn muốn lấy.
  4. Xem mã màu ở bảng Color (F6).
• MS Paint (Windows)
  1. Mở ảnh bằng Paint.
  2. Dùng công cụ Eyedropper để chọn màu.
  3. Vào Edit Colors, xem mã RGB.

Dùng Ứng Dụng Điện Thoại (Android & iOS)

• Color Grab (Android)
• Color Picker for iOS
• Adobe Capture (iOS & Android)

Cách làm:

1. Mở ứng dụng chọn 1 trong các màu đỏ, vàng, cam, lục, lam, chàm, tím...
2. Chụp ảnh hoặc chọn ảnh từ thư viện.
3. Nhấn vào vùng màu cần tra mã: Red · Pink · Orange · Yellow · Purple · Green · Blue · Brown. White. Gray…
4. Ứng dụng sẽ hiển thị mã màu HEX & RGB.

Sử dụng: Tạo Chữ Ký Bằng AI Miễn Phí