Contrast

A GNOME desktop tool for checking whether a colour pair meets WCAG accessibility contrast requirements, written in Rust and GTK4.

gui

⎔ Repository 🌐 Website

Contrast is a minimal GNOME desktop application that instantly checks whether any two colours meet the WCAG accessibility contrast guidelines. Written in Rust with GTK4, it was one of the earliest real-world applications built with the gtk-rs bindings and remains a reference example of idiomatic Rust GUI development on Linux. It is maintained under the GNOME Design Tools umbrella and follows the libadwaita visual language throughout.

Features

Contrast ratio display — Enter any two hex colour values and see the computed contrast ratio immediately, with no button to press.
WCAG AA and AAA ratings — Shows pass/fail results for both Normal Text and Large Text thresholds at both conformance levels.
Screen colour picker — Sample any colour directly from the screen using the system colour picker, no hex code required.
Live text preview — Renders a sample of text over the chosen background so you can judge legibility at a glance.
Keyboard-friendly — Tab between the two colour fields; the ratio updates on every keystroke.
libadwaita styling — Follows GNOME HIG conventions; adapts correctly to light and dark system themes.
Available on Flathub — A sandboxed Flatpak build is the canonical distribution target.

Installation

The recommended install method on any Linux desktop is Flatpak from Flathub:

flatpak install flathub org.gnome.design.Contrast

There is no standalone Debian/Ubuntu or Fedora distro package. Use the Flatpak above, or build from source (see below), on those distributions.

Arch Linux (AUR):

yay -S contrast

Nix:

nix-env -iA nixpkgs.gnome-contrast

Build from source (requires Rust stable and Meson):

git clone https://gitlab.gnome.org/World/design/contrast.git
cd contrast
meson setup _build --prefix=/usr/local
ninja -C _build
sudo ninja -C _build install

Usage

Launch Contrast from your application menu or run:

flatpak run org.gnome.design.Contrast

The interface shows two colour swatches — foreground and background. Type a hex colour code (with or without the leading #) into either field, or click the dropper icon to open the system colour picker and sample a colour directly from your screen.

The contrast ratio and WCAG ratings update live as you type:

Foreground: #1a1a2e
Background: #eaeaea

Contrast ratio:  12.63 : 1

Normal text   AA ✅   AAA ✅
Large text    AA ✅   AAA ✅

WCAG 2.1 thresholds for reference:

Level	Normal text	Large text
AA	≥ 4.5 : 1	≥ 3.0 : 1
AAA	≥ 7.0 : 1	≥ 4.5 : 1

Large text is defined as 18pt (24 px) regular weight or 14pt (approximately 18.67 px) bold.

Why Contrast?

Most contrast checkers are browser-based. Contrast runs natively on the desktop, which means the screen colour picker works across every application — you can sample a colour from a design tool, a terminal, or a rendered PDF without copying hex codes by hand. For designers and developers who need to verify accessibility compliance during day-to-day work, having a native tool in the application launcher is faster than switching to a browser tab.