---
title: "Contrast Checker — Free Framer plugin · Best of Framer"
description: "Free Framer plugin · by Oladipupo Ayoola · Utilities. The Contrast Checker Plugin ensures your colour choices meet WCAG accessibility standards, helping you create inclusive and compliant…"
canonical: "https://framer.elliotli.dev/plugin/contrast-checker"
---

[Home](/)/[Plugins](/plugins)/[Utilities](/plugins/category/utilities)/Contrast Checker

# Contrast Checker

🎨 Contrast Checker

[View on Framer](https://framer.com/marketplace/plugins/contrast-checker/?via=elliot-li)

![Contrast Checker preview image 1](https://framer.elliotli.dev/og/plugin/contrast-checker/77d6e2263287323b/1600x1200.jpg)

## Summary

The Contrast Checker Plugin ensures your colour choices meet WCAG accessibility standards, helping you create inclusive and compliant designs effortlessly.

## Description

**Design with Accessibility in Mind**

As a designer or developer in **Framer**, you understand the importance of **clarity, readability, and accessibility**. The **Contrast Checker Plugin** ensures your colour choices meet **WCAG accessibility standards**, helping you create **inclusive and compliant designs** effortlessly.

**⚡ Features Built for Designers & Developers**

✔️ **Supports HEX, RGB, and HSL Inputs** – Enter colours in your preferred format.

✔️ **Integrated Colour Picker** – Select colours from your canvas for precise testing.

✔️ **Live Preview** – Instantly see how text appears on your selected background.

✔️ **WCAG Compliance Testing** – Check against **AA & AAA contrast ratios** for normal and large text.

✔️ **One-Click Copy Results** – Easily share contrast scores and compliance status.

**🚀 Why This Plugin Matters**

-   **Optimise readability** for all users with accessible colour contrast.
    
-   **Ensure compliance** with WCAG standards effortlessly.
    
-   **Save time** by testing and adjusting directly within Framer.
    
-   **Improve UI consistency**, making your designs more polished and professional.
    

💡 **Perfect for UI/UX designers, developers, and accessibility-focused teams** who want to build with inclusivity in mind.

🔗 **Install the plugin and make accessibility a natural part of your workflow!**

## Rank history [How rankings work →](/terms#rankings)

-   All · #624

## Details

- **Author**: Oladipupo Ayoola
- **Published**: 2025-03-25
- **Updated**: 2025-08-04
- **Added**: 2025-03-16
- **Categories**: Utilities

## More across types

-   [Ticker Marquee](/component/ticker-marquee) — Ahmet Loca · $6 — Ticker Marquee TickerMarquee is a premium animated marquee component for Framer featuring two diagonally intersecting, infinite-scroll text…
-   [Segmented Loader](/component/segmented-loader) — Azardam Studio · Free — Segmented circular loader for modern UI
-   [Attention Tab](/component/attention-tab) — Benjamin Michael Bremer · $2 — an utilities template

## More like this

-   [Framer Form Kit](/plugin/framer-form-kit) — FramerHub.io · Free — Framer Form Kit
-   [Asset Vault](/plugin/framerhub-vault) — FramerHub.io · Free — Asset Vault helps you keep reusable Framer assets in one place.
-   [FramerSend Fields](/plugin/framersend-fields) — Dong P. TRINH · Free — 60+ fields for native Framer forms
-   [Incognito Detect](/plugin/incognito-detect) — Samuel Silva · Free — Incognito Window Detect