MAKE THE DETAILS EASIER TO USE

Accessible Symbol Pairing Preview

Combine icons with labels; compare recognition and contrast across sizes.

Worked exampleBrowser processingUseful downloads

A clear result starts here

Add your input or try the worked example.

Using Accessible Symbol Pairing Preview

Combine icons with labels; compare recognition and contrast across sizes.

Use Try example to explore accessible symbol pairing preview, or enter your own symbol / short icon text.
Set visible label, text color, background. Read the field notes for supported values.
Choose Review input and inspect the result, including any review flags or unsupported cases.
Use the relevant download buttons to keep your result. CSV and report JSON preserve the available findings; original files are not changed.

Example

Symbol / short icon text: ⚠
Visible label: Action required
Text color: #3c214e
Background: #f5eafa
Text size (px): 18

Questions & answers

What does Accessible Symbol Pairing Preview do?

Combine icons with labels; compare recognition and contrast across sizes.

What input does this tool support?

Symbol / short icon text. Visible label. Text color. Background. Text size (px)

What should I check before using the result?

Pairs an existing symbol with visible text and an opaque sRGB contrast check. Actual icon recognition and platform rendering need user testing.

Can I keep or share the result?

Yes. Use the result-specific downloads, CSV where available and report JSON. Downloads can contain your supplied information, so review the content before sharing. Processing runs in this browser; public pages also include the site’s approved advertising and optional analytics.