Regex mã màu HEX

Cập nhật: 24 Tháng 6, 2026

Dùng biểu thức /#([0-9a-fA-F]{6}|[0-9a-fA-F]{3})\b/gi để Trích xuất mã màu HEX 3 hoặc 6 ký tự trong CSS. Trang này có công cụ kiểm tra trực tiếp cùng 6 ví dụ đã được đối chiếu (3 hợp lệ, 3 không hợp lệ).

Biểu thức

6 ví dụ test

/ #([0-9a-fA-F]{6}|[0-9a-fA-F]{3})\b /gi

Group 1: Giá trị màu

/ /

edit_note Văn bản kiểm tra

analytics Kết quả

Số lượng khớp: 0

Chi tiết group:

Chưa có kết quả.

check_circle Ví dụ HỢP LỆ (nên khớp)

#FF5733

Giá trị màu: FF5733

checkKhớp

#fff

Giá trị màu: fff

checkKhớp

#1a1a1a

Giá trị màu: 1a1a1a

checkKhớp

cancel Ví dụ KHÔNG hợp lệ (không khớp)

FF5733

blockKhông khớp

#GGG

blockKhông khớp

#12

blockKhông khớp

code Dùng trong code

JavaScript

const re = /#([0-9a-fA-F]{6}|[0-9a-fA-F]{3})\b/gi;
const matches = str.match(re);

PHP

preg_match_all('~#([0-9a-fA-F]{6}|[0-9a-fA-F]{3})\b~i', $str, $matches);
print_r($matches);

Python

import re
pattern = re.compile(r"#([0-9a-fA-F]{6}|[0-9a-fA-F]{3})\b", re.IGNORECASE)
matches = pattern.findall(text)

re := regexp.MustCompile(`#([0-9a-fA-F]{6}|[0-9a-fA-F]{3})\b`)
matches := re.FindAllString(str, -1)

Trang này cung cấp biểu thức chính quy /#([0-9a-fA-F]{6}|[0-9a-fA-F]{3})b/gi để Trích xuất mã màu HEX 3 hoặc 6 ký tự trong CSS. Bạn có thể kiểm tra trực tiếp với dữ liệu của mình bằng công cụ phía trên, xem các ví dụ đã đối chiếu và sao chép sẵn mã cho JavaScript, PHP, Python và Go. Mẫu thuộc nhóm Web & Mạng.

tips_and_updates Ghi chú & lưu ý chuyên môn

Bắt mã màu HEX dạng đầy đủ #RRGGBB và dạng rút gọn #RGB. Thứ tự trong nhóm chọn (alternation) đặt 6 ký tự TRƯỚC 3 ký tự là có chủ đích: regex thử nhánh trái trước, nếu để 3 trước thì #ffffff sẽ bị bắt nhầm thành #fff. Pattern này chưa hỗ trợ HEX 4/8 ký tự có kênh alpha (#RGBA, #RRGGBBAA) — thêm 8 và 4 vào nhóm nếu cần.

Câu hỏi thường gặp

Regex mã màu HEX như thế nào? expand_more

Dùng biểu thức /#([0-9a-fA-F]{6}|[0-9a-fA-F]{3})\b/gi. Pattern này Trích xuất mã màu HEX 3 hoặc 6 ký tự trong CSS.

Biểu thức "#([0-9a-fA-F]{6}|[0-9a-fA-F]{3})\b" khớp được những ví dụ nào? expand_more

Khớp các giá trị hợp lệ như "#FF5733". Ngược lại, "FF5733" sẽ không khớp. Trang này kèm 3 ví dụ hợp lệ và 3 ví dụ không hợp lệ đã kiểm chứng.

Dùng biểu thức này trong JavaScript ra sao? expand_more

Trong JavaScript: const re = /#([0-9a-fA-F]{6}|[0-9a-fA-F]{3})\b/gi; rồi gọi str.match(re). Bạn cũng có thể dán pattern vào công cụ kiểm tra ở trên để thử với dữ liệu của mình.