Firefox Browser Add-ons
  • Extensions
  • Themes
    • for Firefox
    • Dictionaries & Language Packs
    • Other Browser Sites
    • Add-ons for Android
Log in
Preview of ColorDojo: Eyedropper Tool & Color Picker

ColorDojo: Eyedropper Tool & Color Picker by Caravaca Labs

Eyedropper tool and color picker extension: pick colors privately, copy OKLCH, match Tailwind v4, and check contrast.

0 (0 reviews)0 (0 reviews)
Download Firefox and get the extension
Download file

Extension Metadata

Screenshots
About this extension
Eyedropper tool and color picker extension for Chrome: pick screen colors privately, copy OKLCH, match Tailwind v4, check contrast.

ColorDojo is a private eyedropper tool and color picker extension for developers who need OKLCH, Tailwind matches, and a contrast checker without permanent access to every site. Pick a pixel, copy the value, and keep working.

PICK ONCE, COPY THE FORMAT YOU USE

Choose any screen pixel with Chromium's native eyedropper. ColorDojo shows hex, RGB, HSL, HSV, OKLCH, and Display P3, plus the nearest CSS named color, then copies your default format automatically when auto-copy is enabled. As an rgba color picker it keeps the alpha channel on pasted and imported colors: 8-digit hex or rgb() with alpha, in modern slash or legacy comma syntax. The Alt+Shift+P command puts the pick action under your keyboard, and the toolbar badge turns into a dot of your last picked color.

EDIT CHANNELS BEFORE YOU COMMIT

Picked a color that is almost right? The Edit tab is an HSL color picker with sliders: tune RGB, HSL, or HSV channels, watch the Selected vs new comparison as you drag, then apply. Formats, the Tailwind token, and contrast checks all follow the applied color.

AN EYEDROPPER FOR MAC, WINDOWS, AND LINUX

ColorDojo is an eyedropper extension for every desktop Chrome: the native eyedropper covers screen picks where Chromium provides it. Where it does not, the in-page loupe takes over: a 16x magnifier that samples a single pixel, averages a 3x3, 5x5, 11x11, or 25x25 block, or averages any area you drag. The loupe runs only on the active page and only after your click.

STAY INSIDE THE DESIGN SYSTEM

Every pick is compared locally against the bundled Tailwind CSS v4 palette. ColorDojo shows the closest token, its perceptual delta, paired swatches, and copy actions for both blue-600 and var(--color-blue-600) forms. That is the Tailwind color picker half; theme extraction adds a Tailwind color generator that writes a complete @theme block from the page you are viewing.

CHECK CONTRAST BEFORE THE AUDIT

The built-in WCAG contrast checker shows ratios against white and black the moment you pick. Pair any active color with a history color for WCAG 2.2 AA, large-text, and AAA checks, advisory APCA Lc, and a nearest-lightness suggestion when normal text misses AA.

EXTRACT THE COLORS A PAGE ACTUALLY USES

Run theme extraction only on the active page. ColorDojo combines accessible CSS custom properties with a sampled computed-style census, clusters near-duplicate colors into an OKLCH color palette, and exports CSS variables, a Tailwind v4 @theme block, W3C Design Tokens JSON with OKLCH components, or a plain list in the format you choose.

CONVERT HEX TO OKLCH WITHOUT A CONVERTER TAB

Paste #ef4444, hsl(0 84% 60%), cmyk(0 72 72 6), or oklch(60% 0.2 30) into the palette importer and copy every entry back in the format you need: hex to OKLCH, OKLCH to hex, or HSL to OKLCH, offline, inside the popup.

NO BROWSING-DATA PIPELINE

ColorDojo is a color picker for Chrome with no all-sites host permission and no persistent content script. Inspect and extraction use Chrome's temporary active-tab grant only after your click. The extension makes zero runtime network requests; history and palettes remain in Chrome storage.

The next time a pixel catches your eye, press Alt+Shift+P and bring its color straight into your code.
Rated 0 by 0 reviewers
Log in to rate this extension
There are no ratings yet

Star rating saved

5
0
4
0
3
0
2
0
1
0
No reviews yet
Permissions and data

Required permissions:

  • Input data to the clipboard

Data collection:

  • The developer says this extension doesn't require data collection.
Learn more
More information
Add-on Links
  • Homepage
  • Support site
  • Support Email
  • Copy add-on ID
Version
1.0.0
Size
199.42 KB
Last updated
16 days ago (Jul 24, 2026)
Related Categories
  • Web Development
License
All Rights Reserved
Privacy Policy
Read the privacy policy for this add-on
Version History
  • See all versions
Add to collection
Report this add-on
Go to Mozilla's homepage

Add-ons

  • About
  • Firefox Add-ons Blog
  • Extension Workshop
  • Developer Hub
  • Developer Policies
  • Community Blog
  • Forum
  • Report a bug
  • Review Guide

Download

  • Download Firefox
  • Windows
  • macOS
  • iOS
  • Android
  • Linux
  • All

Latest Builds

  • Nightly
  • Beta

Firefox for Business

  • Enterprise

Community

  • Connect
  • Contribute
  • Developer

Follow

  • Instagram
  • YouTube
  • TikTok
  • Bluesky
  • Podcast
  • Privacy
  • Cookies
  • Legal

Except where otherwise noted, content on this site is licensed under the Creative Commons Attribution Share-Alike License v3.0 or any later version.