inkling

About

inkling highlights color codes on web pages with their actual color — so you can see what #ff6347 or rgb(65, 105, 225) looks like without leaving the page.

Works everywhere: documentation sites, GitHub code views, blog posts, CSS references, design system pages.

SUPPORTED FORMATS
- Hex: #rgb, #rrggbb, #rgba, #rrggbbaa
- RGB: rgb(255, 0, 0), rgba(255, 0, 0, 0.5), rgb(255 0 0 / 50%)
- HSL: hsl(120, 100%, 50%), hsla(120, 100%, 50%, 0.8), hsl(120deg 100% 50%)

6 DISPLAY MODES (combinable)
- Background: fills the text background with the color
- Foreground: colors the text itself
- Marker: small colored square before the text
- Underline: thick colored line under the text
- Dot: colored circle after the text
- Outline: colored border around the text

Mix and match modes — for example, use Underline + Dot together.

SMART BEHAVIOR
- Automatically handles dynamic pages (SPAs, Twitter/X, infinite scroll)
- Skips editable areas: textarea, contenteditable, code editors (Monaco, CodeMirror, Ace)
- WCAG-compliant contrast: auto-adjusts text color on background mode
- Per-site enable/disable
- Keyboard shortcut: Alt+Shift+C to toggle

LIGHTWEIGHT
- ~12kb content script
- No external dependencies
- No data collection, no network requests