How to Use a Color Palette Generator
A color palette generator is useful when you need five related HEX values in front of you, not a mood board of forty almost-identical blues. Hue Parcel keeps a worktable of five tall swatches on the first screen. You generate, lock, edit, copy, and export without creating an account. This article walks through that loop as it actually works on the site.
Start with a palette you can see
The initial set is a cool navy, a mid blue, a lighter steel, a paper cream, and a terracotta: #23395B, #406E8E, #8EA8C3, #F1E9DA, #D98262. Those five colors are a starting specimen, not a secret formula reused for every Generate click. The engine builds new values in HSL and writes them back as sRGB HEX.
Open the color palette generator or the homepage worktable. If you previously used the tool in this browser, localStorage may restore the last palette. Reset Palette returns the original five colors and clears locks.
Generate and lock
Choose a harmony mode first: Balanced, Complementary, Analogous, Triadic, Monochromatic, Warm, or Cool. Generate Palette replaces unlocked swatches. If you like swatch 01, press Lock. The button label switches to Locked so the state is not color-only. Generate again: that HEX stays put while the others move. If a locked color exists, it can seed the next hue family so the new colors stay related to what you kept.
When all five swatches are locked, Generate does not invent a sixth set. The status line tells you to unlock at least one swatch. That is intentional. The tool should not silently ignore a lock or shuffle a color you marked as kept.
Edit HEX by hand
Edit opens a picker and a text field. Valid input is a six-digit HEX value, with or without the leading #, in any case. The site normalizes to uppercase #RRGGBB. Invalid strings get a message instead of a half-applied color. Apply updates the swatch, the ledger, contrast options, mockups, and any later CSS or JSON export. Cancel leaves the previous value.
Copy and export
Copy HEX on a swatch or in the ledger places that one value on the clipboard when the browser allows it. Copy All HEX writes five lines. If clipboard access fails, the status line says so; it does not show a fake Copied state. Export CSS downloads a :root block with --hue-parcel-1 through --hue-parcel-5. Export JSON includes the mode, the HEX list, RGB channels, and lock flags. Open those files locally. Nothing is uploaded.
Modes are relationships, not taste
Complementary leans on a hue and its opposite. Analogous walks neighboring degrees. Triadic uses three families about 120 degrees apart. Monochromatic stays in one hue and changes lightness and saturation so the five stripes do not collapse into a single mud. Warm and Cool bias the hue range. Balanced mixes a related ramp with a contrasting accent. None of this promises that the result will look good on a poster, a dashboard, and a photograph at once. Look at the swatches, then look at them in the context mockups further down the homepage.
Test combinations in context
The three HTML previews map the current five colors to background, primary text, accent, secondary accent, and surface. They are sketches. A heading that looks fine at 34px may fail as 16px body text. Send any pair you care about into the contrast checker. Black on white should report about 21:1. A color on itself should report 1:1.
You can also start from one HEX in Start With One Color, or load a named collection such as Coastal Blue from Palettes. Loading replaces the worktable. If anything is locked, you get a confirmation first.
Warm and Cool modes ignore a strict complementary angle and instead bias the hue into a temperature range. That is helpful when you already know the piece should feel like clay or like harbor water, and less helpful when you must match a single brand HEX. In that case, type the brand color into a swatch, lock it, and generate in Complementary or Analogous so the unlocked columns have to live with the locked one.
If generation looks random, check whether every swatch is unlocked and the mode is still Balanced. Balanced mixes a related ramp with an opposing accent; it is supposed to include a hue that is not a neighbor. Switch to Monochromatic if you wanted a single family. The status line reports the mode that just ran so you are not guessing.
The useful habit is small: lock what you intend to keep, generate the rest, copy the HEX you will actually paste into CSS, and check the type/background pair you plan to ship. The generator is a worktable, not a verdict on whether the design is finished.