devpack
EnglishEspañolPortuguêsBahasa IndonesiaFrançaisРусскийDeutschTiếng Việt

Regex cho mã màu hex

Dùng /^#(?:[0-9a-fA-F]{3,4}|[0-9a-fA-F]{6}|[0-9a-fA-F]{8})$/ để kiểm tra xem toàn bộ chuỗi có phải là mã màu hex hợp lệ hay không. Mọi ví dụ bên dưới đều đã được thử với mẫu này, và bạn có thể mở chúng trong Regex Tester với các mẫu đã được nạp sẵn.

Cập nhật 

/^#(?:[0-9a-fA-F]{3,4}|[0-9a-fA-F]{6}|[0-9a-fA-F]{8})$/
Mở trong Regex Tester
Đầu vàoKết quả
#fff✓ Khớp
#1A2B3C✓ Khớp
#1a2b3c80✓ Khớp
#f0f8✓ Khớp
1a2b3c✗ Không khớp
#12345✗ Không khớp
#ggg✗ Không khớp
#1234567✗ Không khớp

Cách mẫu hoạt động

PhầnÝ nghĩa
^#Bắt đầu bằng #
[0-9a-fA-F]{3,4}Dạng rút gọn: #rgb hoặc #rgba
[0-9a-fA-F]{6}Dạng đầy đủ: #rrggbb
[0-9a-fA-F]{8}Dạng đầy đủ có alpha: #rrggbbaa

Ví dụ code

JavaScript

const re = /^#(?:[0-9a-fA-F]{3,4}|[0-9a-fA-F]{6}|[0-9a-fA-F]{8})$/;
re.test(value); // true or false

Python

import re

bool(re.fullmatch(r'#(?:[0-9a-fA-F]{3,4}|[0-9a-fA-F]{6}|[0-9a-fA-F]{8})', value))

PHP

preg_match('/^#(?:[0-9a-fA-F]{3,4}|[0-9a-fA-F]{6}|[0-9a-fA-F]{8})$/', $value) === 1;

Ghi chú và giới hạn

Cả bốn độ dài đều là CSS hợp lệ. Hãy xóa các lựa chọn {3,4} và {8} nếu hệ thống của bạn chỉ chấp nhận màu sáu chữ số. Chuyển đổi giữa các định dạng bằng Color Converter.

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

Regex cho mã màu hex là gì?
/^#(?:[0-9a-fA-F]{3,4}|[0-9a-fA-F]{6}|[0-9a-fA-F]{8})$/ — mẫu này khớp với toàn bộ chuỗi. Xem bảng phía trên để biết mỗi phần làm gì.
Những ví dụ nào khớp?
Trong các ví dụ đã thử, những mẫu khớp là: #fff, #1A2B3C, #1a2b3c80, #f0f8. Các ví dụ còn lại không khớp.
Làm sao để thử regex này?
Nhấn “Mở trong Regex Tester” — mẫu, cờ và văn bản mẫu sẽ tự động được nạp, và các phần khớp sẽ được tô sáng khi bạn chỉnh sửa.