Skip to main content
Colorstruct
Sign in

Help

Using Colorstruct

What needs an account

Almost nothing. These all work signed out: building and editing palettes, every construction method, importing values, extracting from an image, the accessibility inspector, live previews, all twelve export formats and shareable links.

An account is needed only to:

  • save a palette permanently, so it follows you across devices;
  • publish to Explore or share by unlisted link;
  • like palettes, follow designers, or build collections;
  • report content.

If a deployment has no database configured, the account features show an “offline” state and everything else carries on working.

Visibility

  • Draft — only you. Not reachable by link. Where a palette starts.
  • Private — only you, even if someone has the URL.
  • Unlisted — anyone with the link can view it. It never appears in Explore or on your profile, and it is excluded from search engines.
  • Public — listed in Explore, shown on your profile, and remixable by anyone. Remixes credit you automatically.

Visibility is enforced in the database, not just in the interface: a private palette is not readable by anyone else even through a direct API call.

Keyboard

Everything in the workspace is reachable without a pointer.

Keyboard shortcuts in the workspace
KeysAction
Ctrl / ⌘ + ZUndo the last palette change
Ctrl / ⌘ + Shift + ZRedo
Tab / Shift + TabMove between controls in reading order
Enter or SpaceActivate the focused control
Arrow keysAdjust a slider, or move between segmented options
EscapeClose a dialog, drawer or menu and return focus

Reordering colours does not require dragging: each swatch has move-left and move-right buttons, plus “move to start” and “move to end” in its menu. Every reorder is announced to screen readers.

Extracting from an image

Images are decoded and clustered in your browser. Nothing is uploaded, and nothing is kept after you leave the page. Supported formats are PNG, JPEG, WebP, GIF and AVIF, up to 12 MB.

Five extraction modes are offered — dominant, vibrant, muted, light and dark — and you can also click the image to sample individual pixels. Once extracted, the colours drop into the normal workspace and behave like any other palette.

Exports

Twelve formats: HEX, RGB, HSL and OKLCH lists; CSS custom properties; SCSS; JSON; W3C design tokens; a Tailwind config; and SVG, PNG and printable PDF swatch sheets. You choose what to include — palette name, colour names, roles, all value notations, contrast figures, creator attribution and Colorstruct branding are each optional.

Troubleshooting

My palette disappeared

Unsaved palettes live in this browser’s local storage. Clearing site data, using private browsing, or switching browser or device will lose them. Saving to an account is what makes a palette permanent.

Copy is not working

The clipboard API needs a secure context. On an insecure origin Colorstruct falls back to an older method, and if that also fails it says so rather than pretending it worked — select the value and copy manually.

A colour looks different after generating

It was probably outside the sRGB gamut and got mapped. The Construction panel’s gamut control decides how: reduce chroma (default, holds lightness and hue exactly), shift lightness, or clip channels. The colour editor flags any colour that is out of gamut.

Still stuck

The Learn section covers the concepts in depth. For anything else, the contact address is in the privacy notice.