A11Y: Audit + Color Contrast 5.4

Color Contrast - Professional Review

Color Contrast is a valuable tool designed to measure the contrast between two colors within an image or on a mobile website. This tool aids in ensuring compliance with the internationally recognized guidelines outlined in the Web Content Accessibility Guidelines (WCAG) 2.1 and 3.0 (Silver).

The key features of Color Contrast include:

• Verification of color contrast to meet WCAG 2.1 accessibility guidelines and Section 508 standards.
• Access to suggested colors for improved contrast.
• Generation of comprehensive reports shareable via SMS, Email, or Notes.
• Direct verification of color contrast within Safari and the Photos app.
• Audit functionality for website compliance utilizing AXE.

To utilize Color Contrast effectively:

1. Upload an image or website by selecting the appropriate icon in the top right corner. This can involve an existing Photo Library image or capturing a new photo via the camera. Additionally, input a URL to load a mobile website.
2. Select two colors by adjusting each color picker individually.
3. Interact with the image by swiping or zooming as needed.
4. View Color Contrast results showcased at the bottom of the screen.
5. Create reports by tapping the 'Share' icon for emailing, noting, copying, or saving purposes.

About WCAG 2.1:

The WCAG 2.1 accessibility guidelines dictate three levels of compliance - A, AA, and AAA, each with specific color contrast requirements based on text size.

For further information on WCAG 2.1, please refer to: WCAG 2.1 Guidelines

WCAG 3.0 (Silver)

The W3C Accessibility Guidelines 3.0 (Silver) introduce an experimental color algorithm referred to as S-LUV Advanced Perceptual Contrast (SAPA) or Advanced Perceptual Contrast Algorithm (APCA). This feature can be accessed within the app through the left-hand menu.

To explore more about SAPC-APCA, visit: SAPC-APCA Information

Copy colors to clipboard:

Color Contrast allows users to copy present colors in various formats such as HTML Hex (#EEFFEE), UIColor from RGBA (e.g., UIColor(red:0, green:0, blue:0, alpha:0)), and UIColor from HSB (e.g., UIColor(hue:0, saturation:0, brightness:0, alpha:0)).

If you have any inquiries or feedback concerning Color Contrast's functionality, feel free to reach out to [email protected].