Skip to the guide
Pixx Suite

Create · Palette & color studio · Intermediate

Pixxulo — Intermediate

Build production palettes: hue-shifted ramps, locked harmonies, colours from art, colour-blind checks, previews on your sprites and sharing with every app.

Open Pixxulo

#What you'll learn

  • How to build a full game palette from a few key colours, ramp by ramp.
  • How to use locks and Generate without losing the colours you like.
  • How to pull and refine colours from concept art or an existing sprite.
  • How to check a palette for colour blindness and readable text.
  • How to share palettes with the other Pixx apps and keep them on every device.

#Before you start

  • You should know the basics from the Pixxulo beginner guide: selecting swatches, the Picker, Harmony, Ramp, Extract and Access tabs, and exporting.
  • You need a Pixx plan that includes Pixxulo. Sign in to use Cloud and to send palettes to other apps.
  • Optional: a piece of concept art or a sprite you want to match.

#How-tos

#How to build a game palette from key colours

  1. Click New and name the palette.
  2. Add your 3–5 key colours (for example skin, foliage, stone, water and a highlight colour). Type exact values in Hex · RGB if you have them.
  3. Select the first key colour, open Ramp, keep Hue-shifted ramp, and set Steps to 4–6.
  4. Set Hue shift so shadows lean cool and highlights lean warm, and adjust Darkest and Lightest so the ends don't crush to black or blow out to white.
  5. Click Replace to turn the key colour into its ramp.
  6. Repeat for each key colour, then Sort by Hue to group the ramps.

#How to generate the rest of a palette around colours you love

  1. Click the lock on each swatch you want to keep (the lock tooltip reads Lock (kept when generating / replacing)).
  2. Press Space (or click Generate). Every unlocked swatch gets a new colour from a fresh harmony; locked ones stay exactly as they are.
  3. Keep pressing Space until the unlocked colours fit, then lock them too.
  4. Ctrl+Z steps back if you went one too far.

#How to blend between two colours

  1. Select two swatches (Ctrl+click the second).
  2. Open Ramp and switch to Between two.
  3. Click the button that uses the first two selected swatches, or set the two colours with the colour pickers.
  4. Choose Steps and click Add or Replace. This is great for sky gradients and transitions between biomes.

#How to pull colours from art and clean them up

  1. Open Extract and drop the image on the box (or click it to choose one).
  2. Set Colours (2–64) and choose Refined for the best result or Median cut for a quick split.
  3. Click New palette to keep the result separate from what you're working on.
  4. Click Merge similar to join colours that look the same (a colour difference under 2 on the ΔE2000 scale).
  5. Sort by Smooth so each colour sits next to its closest neighbour, then delete strays with Del.

#How to check accessibility before you commit

  1. Open Access.
  2. Under Simulate colour vision, click through Protan, Deutan and Tritan. The swatches and the preview change to show how the palette looks.
  3. Read Hard to tell apart: these pairs look too similar for some players. Nudge one colour of each pair in Picker (lightness is the most reliable fix).
  4. Check Contrast (WCAG) for the colours you'll use as text on backgrounds. A solid ring means very readable; a dashed ring means readable.
  5. Switch back to Normal when you're done.

#How to preview a palette on your own sprite

  1. In the Preview panel, click Your image and choose a sprite or screenshot.
  2. Choose how it's mapped: Nearest snaps every pixel to the closest palette colour; 1:1 swap maps the image's own colours to your palette in order.
  3. Edit swatches and watch the image update.
  4. Tick Colour cycling, set the from and to swatch numbers and the speed (fps, up to 30), to animate water, lava or glowing effects.

#How to keep palettes on every device

  1. Sign in, then click Cloud → Save my palettes. All your palettes are saved together as one set.
  2. On another device, click Cloud and open the set. Palettes are merged by their id; when both devices have the same palette, the most recently changed one wins.
  3. Save again from whichever device you edit on.

#Workflows

#Palette first, then art

  1. Build the palette here (key colours → ramps → accessibility check).
  2. Send to App → Pixxivi to draw with it.
  3. Send it to Pixxato to convert reference photos into pixel art in the same colours.
  4. Send it to Pixxori: Pixxori makes a recoloured copy of the current tileset, so whole levels match.

#Match an existing game's look

  1. Take a screenshot of the look you want to match.
  2. Extract 16–32 colours with Refined, then New palette.
  3. Merge similar, Sort by Hue, and rebuild any ramp with gaps using Between two.
  4. Preview it on your own sprite with Your image to check it works for your art.

#Theme an interface

  1. Build a small palette: background, panel, light, dark, outline, accent and text.
  2. Send it to Pixxico. Pixxico turns it into a theme and redraws every generated button, panel and bar in it.

#Tips and shortcuts

  • N adds a colour, Space generates, Del deletes, Ctrl+A selects all.
  • ← / → move the selection; Alt+← / Alt+→ move the selected swatch itself.
  • Ctrl+C copies the selected colours as hex codes and Ctrl+V pastes hex codes from anywhere (a chat, a website, a code file) into the open palette.
  • Copy CSS in the bar copies the palette as CSS variables in one click.
  • The search box at the top of the left panel finds palettes by name; Your library palettes lists palettes sent from other apps.

#Troubleshooting

  • If Generate keeps changing a colour, it isn't locked. Lock it, then generate again.
  • If a ramp looks muddy in the middle, lower Hue shift or widen the gap between Darkest and Lightest.
  • If Extract misses a small accent colour, raise Colours, or add the accent by hand with the Picker.
  • If a palette you deleted comes back after opening the cloud set, save the set again from this device; the cloud set only changes when a device saves it.
  • If the image preview looks too different from your art, switch between Nearest and 1:1 swap.