Mô Phỏng Thị Giác Mù Màu
Tải ảnh lên để mô phỏng cách người bị khiếm khuyết thị giác màu sắc nhìn thấy: Protanopia, Deuteranopia, Tritanopia và Achromatopsia (mù màu hoàn toàn).
Cách thức hoạt động
Nhập dữ liệu của bạn
Điền các giá trị cần thiết, dán văn bản hoặc tải lên tệp bạn muốn xử lý.
Xem kết quả tức thì
Hầu hết các công cụ cập nhật theo thời gian thực khi bạn nhập liệu; một số công cụ sử dụng một nút hành động duy nhất.
Sử dụng kết quả
Sao chép, tải xuống hoặc chia sẻ kết quả được tạo — bạn luôn có toàn quyền kiểm soát dữ liệu của mình.
Mô Phỏng Thị Giác Mù Màu là gì?
This online color blindness simulator helps test images, charts, maps, and interfaces with approximate protanopia, deuteranopia, tritanopia, achromatopsia, and partial color vision deficiency views.
How to use the color blindness simulator on images
Upload an image, choose a color vision deficiency profile, and drag the divider to compare the original with the simulation. Everything is processed locally in your browser.
How to compare the original and simulated image
Upload a PNG, JPG, JPEG, or WebP image up to 2 MB. Select a profile and drag the vertical line: the left side shows the original and the right side shows the simulation. Use the arrow keys for precise adjustments or double-click the comparison to reset the divider to 50%.
What each color vision profile represents
- Protanopia and protanomaly: absent or reduced sensitivity to red.
- Deuteranopia and deuteranomaly: absent or reduced sensitivity to green.
- Tritanopia and tritanomaly: absent or reduced sensitivity to blue, mainly affecting blue/yellow distinctions.
- Achromatopsia and achromatomaly: approximate absence of color or partially reduced saturation.
How to use simulation intensity
At 100%, the selected transformation is fully applied. Lower values gradually blend the original with the transformation and help explore partial deficiencies such as protanomaly, deuteranomaly, or tritanomaly. Intensity is an inspection control, not a clinical severity measurement.
What to look for in an accessibility review
- Chart series, map regions, or form states that become difficult to tell apart.
- Error, success, warning, and link states identified only by color.
- Legends, buttons, icons, and indicators without supporting text, shape, pattern, or underlining.
- Focus, selection, and status indicators that disappear or look identical in the simulation.
Color simulation is not a contrast test
The simulator helps evaluate whether colors remain distinguishable. A contrast checker measures luminance differences between content and its background. For a more complete accessibility review, use both tools and never rely on color alone to communicate meaning.
Limits of a color blindness simulation
The previews use approximate RGB transformations. Displays, lighting, visual adaptation, and individual differences can change real perception, so the tool cannot diagnose color blindness or reproduce one person's vision exactly. Combine simulation with contrast checks, clear labels, and user testing when possible.
Privacy and local processing
The image is opened, transformed, and exported inside your browser. Neither the source file nor the simulated preview is sent to the server; the temporary preview is discarded when you replace the image or close the page.
Các Câu Hỏi Thường Gặp (FAQ)
Which image formats and sizes are supported?
You can upload PNG, JPG, JPEG, or WebP files up to 2 MB. Large images are resized only for preview processing, with a limit of 1,600 px wide and about 3 million pixels to keep the browser tool responsive.
What is the difference between protanopia, deuteranopia, and tritanopia?
Protanopia relates to an absent typical red response, deuteranopia to green, and tritanopia to blue, especially affecting blue/yellow pairs. Modes ending in “anomaly” approximate partial forms, while achromatopsia simulates the absence of color.
What does the simulation intensity control do?
Intensity controls how much of the transformation is blended into the original image. Use 100% to inspect the full profile and lower values to explore a partial change. The percentage does not represent a medical degree of color blindness.
How does the vertical comparison line work?
The area left of the line shows the original image and the area to the right shows the selected profile. Drag the circle, use arrow keys while the control is focused, or double-click to return the divider to the center. You can also open the comparison fullscreen.
Which color blindness mode should I test first?
Start with protanopia and deuteranopia when reviewing red/green combinations. Then test tritanopia for blue/yellow pairs and achromatopsia to confirm that labels, shapes, and hierarchy still carry the message without hue.
Does the simulator replace a contrast checker?
No. Simulation exposes possible color confusion, while contrast checking measures luminance and readability. An element can remain distinguishable in the simulation and still have insufficient contrast, so use both checks.
Does my uploaded image stay private?
Yes. All image processing happens locally in your browser. The tool does not send the source file or simulated image to the server.
Can I download the simulation while using fullscreen?
The download button exports only the current simulated version as a PNG, whether the viewer is normal or fullscreen. The file uses the processed preview resolution, which may be reduced for very large images.
Can this simulator diagnose color blindness?
No. The tool transforms colors to support design and accessibility review; it is not a vision test, cannot provide a diagnosis, and does not exactly represent any one person's perception. Consult an eye-care professional for clinical assessment.
Công Cụ Liên Quan
- Khả dụngCục bộ
Kiểm Tra Độ Tương Phản Màu
Kiểm tra tỷ lệ tương phản màu sắc văn bản và nền theo tiêu chuẩn WCAG 2.1.
- Khả dụngCục bộ
Tính Tỷ Lệ Khung Hình (Aspect Ratio)
Tính kích thước chiều rộng hoặc chiều cao tương ứng theo tỷ lệ 16:9, 4:3, 1:1...
- Khả dụngCục bộ
Trình Tạo CSS clamp() Kiểu Chữ & Khoảng Cách Linh Hoạt
Tạo các quy tắc CSS clamp() cho cỡ chữ và khoảng cách co giãn mượt mà theo màn hình.
- Khả dụngCục bộ
Chuyển Đổi SVG sang Data URI
Chuyển đổi mã SVG thành chuỗi CSS background Data URI và ngược lại.
- Khả dụngCục bộ
Trích Xuất Bảng Màu từ Hình Ảnh
Tự động trích xuất các màu sắc chủ đạo từ bất kỳ bức ảnh nào.
- Khả dụngCục bộ
Tối Ưu Hóa Tệp SVG
Giảm dung lượng tệp vector SVG bằng cách loại bỏ mã thừa và làm gọn đường vẽ.
- Khả dụngCục bộ
Tính Điểm Ưu Tiên CSS Specificity
Đo lường và so sánh trọng số ưu tiên của các bộ chọn CSS (Inline, ID, Class, Element).
- Khả dụngCục bộ
Tính Thang Tỷ Lệ Kiểu Chữ Typography
Tạo hệ thống cỡ chữ hài hòa theo các tỷ lệ vàng, tỷ lệ Major Third, Perfect Fourth...
- Khả dụngCục bộ
Tính Mật Độ Điểm Ảnh Màn Hình (PPI)
Tính mật độ điểm ảnh PPI, kích thước điểm ảnh (dot pitch) và tổng số pixel màn hình.
- Khả dụngCục bộ
Tạo Chữ Ký Email Chuyên Nghiệp HTML
Tạo mẫu chữ ký email đẹp mắt kèm logo, chức danh, liên kết mạng xã hội.