Có thể lấy mẫu màu của ứng dụng khác (như Photoshop, Word) ngoài trình duyệt không?

Có. Chuẩn EyeDropper API cho phép bạn di chuyển kính lúp ra ngoài cửa sổ trình duyệt và chấm lấy màu của bất kỳ phần mềm nào đang mở trên màn hình máy tính.

EyeDropper API có thể chụp lén màn hình của tôi không?

Tuyệt đối không. Trang web chỉ nhận được một mã màu duy nhất (ví dụ: #3B82F6) tại đúng điểm ảnh bạn bấm nhấp chuột, hoàn toàn không nhận được ảnh chụp màn hình.

Những trình duyệt nào hỗ trợ tính năng ống hút màu này?

Hỗ trợ trên tất cả các trình duyệt nhân Chromium gồm: Google Chrome, Microsoft Edge, Opera, Cốc Cốc, Brave trên máy tính Windows, macOS và ChromeOS.

Trang web có lưu lại danh sách các màu tôi đã lấy không?

Có. Bảng lịch sử màu (Color Palette History) được lưu tạm trong bộ nhớ tab để bạn dễ dàng sao chép lại nhiều màu cùng lúc.

Mã màu HEX và RGB khác nhau thế nào?

Mã HEX sử dụng hệ thập lục phân 6 ký tự (ví dụ: #2563EB) rất phổ biến trong CSS web. Mã RGB biểu diễn cường độ 3 màu Đỏ, Xanh lá, Xanh dương từ 0 đến 255 (ví dụ: rgb(37, 99, 235)).

Làm thế nào để thoát chế độ lấy mẫu màu?

Bạn chỉ cần nhấn phím ESC trên bàn phím hoặc nhấp chuột phải để hủy bỏ chế độ lấy màu bất cứ lúc nào.

Ống Hút Màu & Lấy Mẫu Màu Màn Hình

Chấm chọn bất kỳ điểm ảnh nào trên màn hình để lấy mẫu màu sắc chính xác và sao chép mã màu HEX, RGB, HSL trong một cú nhấp chuột.

Thông Số Kỹ Thuật & Đo Kiểm

Mã màu HEX (Bấm để sao chép)

#2F5BD3

RGB Format

rgb(47, 91, 211)

Định dạng mã màu HSL

hsl(224, 65%, 51%)

Hướng Dẫn Sử Dụng Chi Tiết

BƯỚC 1

Nhấn Chọn màu từ màn hình

Con trỏ chuột sẽ biến thành một chiếc kính lúp phóng to từng điểm ảnh với độ chính xác tuyệt đối.

BƯỚC 2

Rê chuột lên bất kỳ điểm ảnh nào

Di chuyển kính lúp lên bức ảnh, bản thiết kế, trang web hoặc bất kỳ phần mềm nào đang mở trên màn hình.

BƯỚC 3

Nhấp chuột để lấy mã màu

Nhấp chuột một lần để khóa màu và sao chép ngay mã HEX, RGB hoặc HSL vào bộ nhớ tạm.

Công Nghệ Trích Xuất Pixel EyeDropper API & Các Không Gian Màu Đồ Họa

EyeDropper API là một giao diện lập trình web thế hệ mới được W3C chuẩn hóa nhằm mang lại trải nghiệm chọn màu cấp hệ thống cho các ứng dụng web sáng tạo. Trước khi có API này, các trang web hoàn toàn không thể đọc được màu sắc của các pixel nằm ngoài ranh giới thẻ tài liệu HTML do các chính sách bảo mật cùng nguồn gốc (Same-Origin Policy).

Khi bạn kích hoạt công cụ Eyedropper, trình duyệt sẽ tạm thời trao quyền cho một con trỏ kính lúp đặc biệt (Pixel Loupe). Kính lúp này phóng đại ma trận điểm ảnh xung quanh con trỏ chuột theo tỷ lệ 10x kèm theo lưới căn chỉnh tọa độ, cho phép bạn chấm chính xác đến từng pixel biên của logo, hình ảnh minh họa hoặc thanh công cụ phần mềm.

Công cụ tự động chuyển đổi giá trị màu thu được sang 4 định dạng quy chuẩn ngành: Mã HEX (#RRGGBB) ngắn gọn chuẩn mực cho mã nguồn CSS; Mã RGB biểu diễn trực quan 3 kênh ánh sáng quang phổ (Đỏ, Lục, Lam) từ 0 đến 255; Mã HSL mô tả màu sắc theo nhận thức thị giác tự nhiên (Sắc độ, Độ bão hòa, Độ sáng); và Mã HSV hỗ trợ trực quan cho các phần mềm dựng hình 3D và biên tập video kỹ thuật số.

Câu Hỏi Thường Gặp (FAQ)

Ống hút màu này có lấy được màu bên ngoài cửa sổ trình duyệt không?

Có! Khi chạy trên các trình duyệt máy tính được hỗ trợ (Chrome, Edge, Opera), EyeDropper API có thể lấy mẫu màu từ mọi ứng dụng, hình nền máy tính hoặc video đang phát.

Làm sao để thoát khỏi chế độ hút màu?

Bạn chỉ cần nhấn phím Escape (ESC) trên bàn phím để hủy chế độ chọn màu mà không lưu lại màu nào.

EyeDropper API có được hỗ trợ trên Firefox hoặc Safari không?

Firefox và Safari hiện chưa kích hoạt EyeDropper API trên máy tính. Trên các trình duyệt này, công cụ sẽ tự động chuyển sang bảng màu tương tác thay thế.

Định dạng mã màu nào tối ưu nhất cho thiết kế web CSS?

Mã màu HEX (#RRGGBB) là định dạng phổ biến nhất trong CSS web, trong khi HSL (Sắc độ, Độ bão hòa, Độ sáng) rất được ưa chuộng khi tạo các biến thể màu sắc và độ trong suốt.

Công cụ Eyedropper có thể lấy mã màu ngoài cửa sổ trình duyệt không?

Có. Khi bạn bấm kích hoạt công cụ, kính lúp lấy màu có thể di chuyển ra toàn bộ màn hình máy tính của bạn bao gồm thanh Taskbar, các phần mềm đồ họa Photoshop, Figma hay bất kỳ ảnh nào trên màn hình.

Tại sao mã màu HEX và RGB lại được dùng phổ biến nhất trong lập trình web?

Mã HEX rất ngắn gọn (chỉ 6 ký tự) dễ dùng trong mã CSS, trong khi mã RGB biểu diễn trực quan cường độ ánh sáng của 3 kênh màu phát quang của màn hình máy tính từ giá trị 0 đến 255.

Định dạng màu HSL có ưu điểm gì so với RGB?

HSL biểu diễn màu sắc theo tâm lý thị giác con người: Hue (sắc độ màu theo vòng tròn 360 độ), Saturation (độ bão hòa màu sắc) và Lightness (độ sáng tối), giúp việc tạo các tông màu đậm nhạt đồng bộ dễ dàng hơn rất nhiều.

Trình duyệt nào hỗ trợ tốt nhất công cụ EyeDropper API?

EyeDropper API hoạt động mượt mà trên tất cả các trình duyệt nhân Chromium như Google Chrome, Microsoft Edge, Opera và Brave trên hệ điều hành Windows, macOS và ChromeOS.