Eyedropper · CSS Colours · Palette · Measure
Click Pick Colour to sample any colour from your screen — this uses your browser's system-level eyedropper, so it already works anywhere on your display: other app windows, the taskbar, your desktop, not just this page. Values are shown in HEX, RGB, HSL, and CMYK.
Enter any website URL to extract colours from its stylesheets, inline styles, and
<style> blocks.
Click any chip to copy, or hover and click + to send it to your active palette.
No colours in this palette yet.
Click any swatch to add it to your active palette.
No eyedropper history yet. Go to the Eyedropper tab to pick colours.
Colours extracted from the CSS tab appear here. Click to add individual colours.
No CSS colours extracted yet.
Click Activate Measurement to draw a rectangle on this page. To measure something on your desktop, in another app, or in another window — click Measure Outside This Window instead: your browser will ask you to share your screen/window, a snapshot is captured, and you draw the rectangle on top of it. Dimensions are shown in pixels, centimetres, and millimetres. Press Esc or click Exit to close.
⚙️ Conversion basis: CSS standard (1 inch = 96 px = 2.54 cm = 25.4 mm)
Device pixel ratio: — |
Estimated DPI: —
Outside-window capture: takes a single snapshot (not a live feed) and is scaled to fit your browser window if needed — the pixel/cm/mm figures are corrected back to full resolution either way.
No measurements yet. Activate the overlay above and draw a rectangle.
Physical accuracy depends on your actual screen DPI. CSS uses 96 dpi as the standard reference.