Formats

A format is how a color is written out: #0d75ee, rgb(13 117 238), Color(red: 0.051, green: 0.459, blue: 0.933). Dabbit ships with about thirty and lets you add your own.

The default format

Copy colors as in Settings → Formats is what every pick copies. Hex, to start. The menu bar mark also has Copy as, for a one-off in any other format without changing the default.

Built-in formats

• Web: Hex, Hex (lowercase), Hex with alpha, Hex (no hash), RGB, RGB (commas), RGBA, HSL, OKLCH, OKLab, Lab, LCH, Display P3, Tailwind arbitrary value, Nearest CSS name
• Apple: SwiftUI Color, SwiftUI Color (P3), SwiftUI hex literal, UIColor, NSColor, Objective-C UIColor
• Android: Android #AARRGGBB, Color.rgb(), Jetpack Compose
• Other: Flutter, Unity, Godot, Python tuple, RGB floats, RGB 0–255, HSB, CMYK

Readout

The library window and the loupe’s hover card show a color in several formats at once, so you can read the HSL of something without switching your default to HSL. Choose which ones under Readout. The default set is Hex, RGB, HSL and OKLCH.

Smart format

Turn on Use the format the frontmost app expects and Dabbit picks the format by where you are: Hex in Figma, Sketch, Photoshop, Illustrator, Framer, VS Code, Cursor and the JetBrains IDEs; SwiftUI in Xcode; Android in Android Studio. Add a rule for any app you have open, change a rule’s format, or remove it; Restore defaults brings the built-in list back.

Smart format only applies to picks. Copy as, exports and the readout use what you ask for.

Custom formats

New format… (or Duplicate built-in… to start from one) opens the editor. A format is a template with tokens in braces, filled in from the color:

rgba({r}, {g}, {b}, {a:2})        →  rgba(13, 117, 238, 1.00)
Color(hex: 0x{HEX})               →  Color(hex: 0x0D75EE)
--{name}: oklch({ok.l:3} {ok.c:4} {ok.h:1});

The editor lists every token and shows the result live for the current color. The main ones:

Token	Gives
{hex} {HEX} {hex8} {HEX8} {argb} {ARGB}	Hex, lower or upper; with alpha at the end; Android’s alpha-first order
{r} {g} {b}	0–255 channels
{rf} {gf} {bf}	0–1 channels
{a} {a255} {apct}	Alpha as 0–1, 0–255, or percent
{h} {s} {l}	HSL, degrees and percent
{hsb.h} {hsb.s} {hsb.b}	HSB
{ok.l} {ok.c} {ok.h} {ok.a} {ok.b}	OKLCH / OKLab
{lab.l} {lab.a} {lab.b} {lch.l} {lch.c} {lch.h}	CIE Lab / LCH
{p3.r} {p3.g} {p3.b}	Display P3 channels, 0–1
{c} {m} {y} {k}	CMYK
{lum}	Relative luminance
{name}	The palette name, if the color is in one of your palettes; otherwise the nearest CSS name

Add :N to any numeric token for N decimals: {rf:3}, {ok.c:4}. Whole numbers otherwise.

Custom formats appear everywhere built-in ones do: the default picker, Copy as, the readout, Smart format rules, and the format= parameter of the URL scheme. They’re included in backups.