Copy color codes on Mac: format, space, and precision
The right syntax depends on the destination. A reliable handoff also says what the sampled value represents and what it leaves out.
Copy the format the destination accepts, then carry the color context separately. Hex or RGB is usually appropriate for a solid sRGB value. Use CSS rgba when alpha matters, HSL or HSB when someone will edit channels by hand, and SwiftUI Color or UIColor when the immediate destination is source code.
TeenyColor converts a sampled screen color to sRGB before formatting it. That makes its outputs consistent, but it also sets a boundary: a copy from TeenyColor does not preserve an original Display P3 value, a named design token, or an adaptive system color.
If you still need the screen value, start with the guide to picking a color on Mac. Return here when you need to choose the destination syntax and document its limits.
Choose a format by destination
| Format | TeenyColor output | Good fit | Important limit |
|---|---|---|---|
| Hex / lowercase hex | Rounded 8-bit sRGB channels, such as #3A7BD5. |
Solid CSS values, design notes, and compact handoffs. | The six-digit output does not include alpha or wide-gamut intent. |
| RGB | Rounded 0 to 255 channels, either wrapped as rgb() or copied as decimals. |
Channel inspection, screenshot discussion, and debugging. | It is another notation for the same converted sRGB sample. |
| HSL / HSB | Hue, saturation, lightness, or brightness rounded to whole values. | Manual theme adjustments where the relationship between channels matters. | The editable notation does not add color fidelity. |
| CSS rgba | Rounded 8-bit RGB channels and alpha rounded to one decimal place. | CSS when opacity belongs in the copied value. | One-decimal alpha can be too coarse for an exact source token. |
| SwiftUI Color / UIColor | sRGB components rounded to two decimal places; UIColor includes alpha. | Prototypes, small views, and constant source values. | A constant initializer is not a named or appearance-aware color asset. |
01Pick the destination before the syntax
A destination-specific value saves translation work. Use hex when a stylesheet or handoff document expects hex. Copy a SwiftUI initializer when a developer is about to paste into a prototype. Use HSL only when its channels make the next edit easier.
If the destination is unknown, send the smallest useful packet: a hex value, the words “sRGB sample,” the UI state and appearance you sampled, and a link to the source design or token. That is more dependable than pasting every available notation.
This workflow also prevents format choice from masquerading as a design decision. Uppercase and lowercase hex represent the same channel values. A color renamed “primary” in a note does not become the product’s approved primary token.
02State the color space
A numeric triplet is incomplete without a color space. The same component values can describe different visible colors in sRGB and Display P3. CSS Color 4 therefore treats rgb() as sRGB and provides separate syntax for spaces such as Display P3.
TeenyColor’s current picker service converts the selected sample to sRGB. Its hex, RGB, HSL, HSB, CSS, SwiftUI, and UIColor outputs all come from that converted color. It does not emit color(display-p3 ...) or preserve a P3 source value for later export.
That boundary is useful, not hidden. Use TeenyColor for a consistent screen sample and sRGB handoff. Keep the original design token, Asset Catalog entry, or CSS wide-gamut value as the source of truth when gamut matters.
03Know where rounding occurs
TeenyColor does not print every internal floating-point digit. Its source rounds hex, RGB, and CSS channels to 8-bit integers. HSL and HSB values use whole degrees or percentages. SwiftUI and UIColor components use two decimal places, while CSS alpha uses one.
That precision is readable and practical for copied snippets. It is not interchangeable with an exact source token. For example, a component represented as 0.53 in a SwiftUI initializer can map to a nearby but not necessarily identical 8-bit value when another tool converts it again.
Choose one canonical representation for approved values. Treat the other formats as destination copies derived from it, rather than round-tripping the value through several syntaxes.
04Do not turn a sample into a semantic color
A screen picker captures the resolved pixel at one moment. It cannot infer whether that pixel came from a named asset, a system color, a pressed state, a translucent overlay, or a value that changes between light and dark appearance.
TeenyColor’s SwiftUI and UIColor copies are constant sRGB initializers. They are convenient for prototypes and small source edits. They do not reproduce the adaptive behavior of a named Asset Catalog color or a semantic system color.
Record the sampled state and appearance, then compare the result with the source design. For approved application colors, move the value into the project’s named asset or token system. The sRGB design-token review workflow covers that promotion without confusing the observed pixel with the intended token.
05Use one sample for several destination copies
The app's source uses NSColorSampler to show the system color-sampling interface. After selection, TeenyColor converts the sampled color to sRGB, creates a picked-color record, inserts it into local history, trims unpinned history based on your limit, and writes the selected formatted value to NSPasteboard.general.
The current format list is Hex, lowercase hex, RGB, RGB decimal, HSL, HSB/HSV, SwiftUI Color, UIColor, and CSS rgba. The detail view can show all formats for a saved color, so you can pick once and copy a different syntax later.
Apple’s Digital Color Meter is a good built-in option when you need to inspect or copy a value once. TeenyColor’s additional value is reuse: local history, pinned colors, and several output syntaxes from the same saved sRGB sample.
A compact color handoff
- Destination: the CSS property, Swift source file, ticket, or token record that will use the value.
- Value: one destination-ready format, not a dump of every notation.
- Context: “sampled as sRGB,” plus the light or dark appearance and UI state.
- Source: the design file, Asset Catalog name, or token identifier that remains authoritative.
For a handoff that also includes structured values, use the TeenyApps Mac design handoff checklist. It keeps the color sample, JSON payload, source links, and acceptance state in one bounded packet.
Privacy and limits
TeenyColor does not need a cloud service to copy a color code. The color sample, history, pin state, names, and export data are local Mac work.
Local storage does not decide what should be retained. Clear unpinned history after work on confidential UI, and pin only values you intend to reuse. A local sample also does not verify accessibility, color contrast, token approval, or rendering on another display.
For JSON token snippets, the TeenyTool guide to formatting JSON locally on Mac explains when its Pretty mode changes object-key order and when Compact preserves it.
Common questions
Does converting a sampled color to hex change it?
TeenyColor first converts the sample to sRGB, then rounds each channel to an 8-bit value for hex. That is an appropriate compact representation of the converted sRGB sample, but it is not a way to preserve an original Display P3 value.
Can TeenyColor copy Display P3 color syntax?
No. The current TeenyColor source converts a sampled color to sRGB and does not emit CSS color(display-p3 ...) or a Display P3 SwiftUI initializer. Keep the source asset or token when wide-gamut intent matters.
Can a sampled color become an adaptive SwiftUI color?
Not by sampling alone. TeenyColor copies a constant initializer for the resolved sample. Use a named Asset Catalog color or a semantic system color when the app should adapt to appearance or context.
Sources checked
- TeenyColor feature and precision claims were checked against the local homepage and source files for
ColorPickerService,ColorConverter,ColorFormat, andColorListViewModel. - Apple NSColorSampler documentation for the system color-sampling interface.
- Apple SwiftUI Color documentation for context-dependent and named colors.
- Apple Digital Color Meter User Guide for built-in color inspection and copy behavior.
- W3C CSS Color Module Level 4 for sRGB, Display P3, alpha, and color-space syntax.
Pick once. Copy the format you need.
teenycolor is a $4.99 Mac menu bar color picker with auto-copy, local history, pinned colors, palette export, contrast checks, and nine copy formats.