---
name: color-contrast-checker-instructions
description: "Ensure UI elements comply with WCAG 2.1 accessibility targets. Use when the user wants help with Color Contrast Checker Instructions. Related topics: design, ux, color."
---

# Color Contrast Checker Instructions

Ensure UI elements comply with WCAG 2.1 accessibility targets.

## How to use this skill

1. Ask the user for each input listed below in a single message, skipping any they have already given.
2. Where options are listed, offer them, but accept other answers too.
3. Fill the answers into the prompt template, then follow the completed prompt to produce the result.

## Inputs

- **Foreground Hex** (free text)
- **Background Hex** (free text)
- **Text Size** (choose one: Normal (under 18pt), Large (18pt or larger))

## Prompt template

## Introduction
Determine if background and foreground colors pass WCAG AA/AAA.

## Colors
- Foreground Hex: {{Foreground Hex}}
- Background Hex: {{Background Hex}}
- Text Size: {{Text Size}}

---

Source: [Color Contrast Checker Instructions on PromptBuild](https://promptbuild.io/prompt/i2xOSOQWytg6F6sFs9Tf/color-contrast-checker-instructions)