Trình tạo bảng màu
Tạo các bảng màu hài hòa từ bất kỳ màu cơ sở nào. Hỗ trợ các sơ đồ màu bổ túc, tương đồng, bộ ba và đơn sắc.
Complementary
#6366F1#F1EE63Analogous
#63ADF1#6366F1#A763F1Triadic
#6366F1#F16366#66F163Split Complement
#6366F1#F1A763#ADF163Tetradic
#6366F1#F163AD#F1EE63#63F1A7Monochromatic
#0F13AC#1D21EB#6366F1#A1A3F7#D0D1FBCách sử dụng công cụ này
- 1
Click the color swatch to open your system color picker, or type a 6-digit hex code like #6366F1 into the text field next to it.
- 2
Watch the six scheme rows update instantly as you change the base color.
- 3
Read the uppercase hex code shown in the bottom-left corner of each swatch and copy the ones you want into your design tool or stylesheet.
Trình tạo bảng màu là gì?
Lý thuyết màu sắc xác định các mối quan hệ hài hòa dựa trên vị trí trên vòng tròn màu. Các màu bổ túc nằm ở vị trí đối diện nhau (180°). Các màu tương đồng nằm liền kề (30°). Các sơ đồ bộ ba dùng ba màu cách đều nhau (120°). Công cụ này tính toán từng sơ đồ từ màu cơ sở mà bạn chọn, mang lại cho bạn một bảng màu khởi đầu dựa trên lý thuyết màu sắc đã được kiểm chứng.
Các trường hợp sử dụng phổ biến
Picking a primary plus accent color for a website by reading the complementary pair off your brand color.
Building a calm, unified UI background-and-card scheme from the analogous row.
Generating a 5-step monochromatic tint and shade ramp for hover, active, and disabled button states.
Sketching a data-visualization palette where triadic or tetradic colors keep series visually distinct.
Exploring logo or illustration color combinations before committing in Figma or Illustrator.
Quickly grabbing hex codes for a CSS variable set without leaving the browser.
Câu hỏi thường gặp
Sơ đồ nào tốt nhất cho các trang web?▼
Công cụ liên quan
Trình chuyển đổi màu (HEX/RGB/HSL)
Chuyển đổi màu giữa các định dạng HEX, RGB và HSL. Chọn màu trực quan hoặc nhập các giá trị thủ công.
Trình tạo Box Shadow CSS
Tạo các giá trị box-shadow trong CSS một cách trực quan. Xem trước theo thời gian thực và sao chép CSS được tạo ra.
Bộ tạo dải màu chuyển sắc CSS
Tạo các dải màu chuyển sắc CSS dạng tuyến tính và tỏa tròn. Chọn màu một cách trực quan và sao chép đoạn CSS được tạo ra.
Bộ tạo đường cong gia tốc Cubic Bezier
Tạo các đường cong gia tốc cubic-bezier cho CSS. Bao gồm các giá trị cài sẵn theo chuẩn.
Trình tạo Border Radius CSS
Tạo các giá trị border-radius phức tạp trong CSS một cách trực quan. Kiểm soát độc lập từng góc.
Trình tạo CSS Clamp()
Tạo các giá trị CSS linh hoạt và đáp ứng với clamp(). Co giãn mượt mà giữa kích thước tối thiểu và tối đa trên các khoảng của viewport.