# Color and palettes

Pick colors, build and edit the sprite's palette, use palettes from your library, and work in indexed color.

_Shortcuts are written for Windows and Linux. On a Mac, use ⌘ Cmd where they say Ctrl, and ⌥ Option for Alt._

You paint with two colors at a time, the **foreground** and the **background**, and keep the colors
a sprite uses in its **palette**. Palettes you like can be saved to your library and used in any
sprite.

## Foreground and background

The left mouse button paints with the foreground color and the right button with the background
color. They start as black and white.

- **Click** a palette swatch to make it the foreground color; **right-click** it for the
  background. From the keyboard, `Enter` picks the foreground and `Shift+Enter` the
  background. On a touch screen, tap the swatch, then the palette's **background** button (below).
- Press `X` to swap the two.
- Hold `Alt` over the canvas, or use the Eyedropper, to pick a color off the sprite.
- The **Colors** panel shows both. Click one to choose which the color picker edits; the picker's
  heading says **Editing Foreground** or **Editing Background**. A color that matches a palette
  entry shows its index (`Idx-3`); otherwise it reads **Custom**.
- **Drag** a foreground or background color in the Colors panel to adjust it without opening the
  picker: right shifts the hue, up lightens and down darkens. Hold `Shift` to shift the
  saturation instead of the hue.
- **Recent** keeps the last ten foreground colors you chose. Click one to use it again.

Picks follow the sprite's color mode: in a grayscale sprite a color becomes its gray, and in an
indexed sprite it snaps to the nearest palette color.

## The color picker

The **Color picker** panel picks any color. Its tabs show different ways of choosing:

| Tab | Shows |
| - | - |
| **Shades** | a saturation and brightness square, with a hue slider |
| **Spectrum** | hue across, lightness down, with a saturation slider |
| **Wheel** | a hue and saturation wheel, with a brightness slider |
| **Sliders** | channel sliders and number fields, in RGB, HSV, HSL or OKLCH |
| **Normal map** | colors for normal maps (turn it on in the settings) |

- **Opacity** sets the color's transparency.
- The text field takes any color you type or paste (`#ff8800`, `rgb(...)`, `oklch(...)`); the
  button beside it switches between HEX, RGB, HSL and OKLCH.
- The pipette button picks a color from anywhere on your screen, in browsers that allow it.
- The **settings** (the cog) choose which tabs show, the color space (HSV, a painter's RYB wheel,
  or OKLCH, where equal steps look equally bright), a **harmony** (complementary, triadic and more)
  shown as color chips, and whether the picker snaps to steps.

In a grayscale sprite the picker is a single brightness slider.

## The palette

The **Palette** panel holds the sprite's colors.

| Button | Does |
| - | - |
| **+** | Adds the foreground color (if it isn't there already). |
| **Swap** | Swaps the foreground and background colors. |
| **Sort** | Sorts the palette, or the selected range, by hue, saturation, brightness, luminance, a channel or alpha, ascending or descending, in the same order as Aseprite. Fully transparent colors always go first, and sorting by hue puts the grays first (dark to light) when ascending and last when descending. |
| **Create ramp** | With a range selected: fills the colors between its two ends with an even gradient, or inserts new in-between colors. |
| **Shading ramp** | With a range selected: makes it the Shades list for the Shading ink. With the Gradient tool, it makes the range the gradient's Stops instead. |
| **Palette Lock** (the padlock, RGBA sprites) | Turns [Palette Lock](https://pxstud.io/docs/manual/guides/color.md#palette-lock) on or off. |
| **Palette tools** (**...**) | [Palette Audit](https://pxstud.io/docs/manual/guides/color.md#palette-audit), [Clean Up Palette](https://pxstud.io/docs/manual/guides/color.md#cleaning-up-the-palette), Palette Lock, and the [palette groups](https://pxstud.io/docs/manual/guides/color.md#palette-groups). |
| **Library** | Opens the Palette Library. |

Below them, the selected swatch can be **edited**, made the **background** color, **replaced**
with the foreground color, or **removed**.

Working with swatches:

- **Shift+click** (or `Shift` and the arrow keys) selects a range.
- **Drag** a swatch, or press `Alt` and an arrow key, to reorder.
- **Double-click** or press `F2` to edit a color.
- `Del` removes the selected color.

Palette changes are part of the sprite, so they can be undone.

The same palette tools are in Sprite > Palette > Palette Audit..., Sprite > Palette > Clean Up Palette... and
Sprite > Palette > Palette Lock.

### Palette groups

A group gives a name to a run of palette entries, such as "Skin" or "Foliage". Its name shows as
a chip above the swatches.

- To make one, select a swatch or **Shift+click** a range, then choose **New Group from
  Range...** in the **...** menu and name it. A new group trims any group it overlaps.
- **Click** a chip to select the group's colors as a range, ready to sort, make a ramp from, or
  use as Shades.
- **Double-click** a chip (or choose **Edit Group...** with one of its swatches selected) to
  rename or remove it. **Remove All Groups** clears them.

Groups name palette positions, not colors: moving, sorting or removing colors doesn't move a
group. Groups are saved with the sprite and apply to every palette when the palette changes over
time.

### Palette Audit

Sprite > Palette > Palette Audit... lists every color the artwork uses that isn't in the palette, most-used
first, with its pixel count and the palette color it is closest to. For each one you can:

- **Add** it to the palette.
- **Remap** it: its pixels become the palette color on the right. That is the nearest color
  unless you pick another from the list.

**Add all to palette** and **Remap all** do every color at once. The list updates as you go, and
says when every color is in the palette. Remapping changes the cels of every layer you can edit
(locked and hidden layers are skipped) in the frames that share the active frame's palette. It is
one undo step.

The audit is for RGBA sprites; an indexed sprite only uses palette colors.

### Cleaning up the palette

Sprite > Palette > Clean Up Palette... tidies the palette in effect at the active frame:

- **Merge duplicate colors** keeps the first of each set of identical colors.
- **Merge similar colors** also merges colors closer than **Distance** to an earlier one (about 2
  is barely visible, 10 is clearly different).
- **Remove unused colors** removes colors no pixel uses.

The dialog shows the palette that will be left before you apply. In an indexed sprite the pixels
follow their colors to their new positions, pixels of a merged similar color take the color that
was kept, and the transparent entry is never removed. In RGBA and grayscale sprites only the
swatches change.

### Palette Lock

With **Palette Lock** on (the padlock in the Palette panel, or Sprite > Palette > Palette Lock), an RGBA
sprite behaves like an indexed one while you draw: every pixel a tool paints snaps to the
nearest palette color, including soft brush edges, blended inks and gradients. The foreground
and background colors snap to the palette too. Pixels you don't paint over keep their colors; use
the [Palette Audit](https://pxstud.io/docs/manual/guides/color.md#palette-audit) to bring existing artwork onto the palette.

Palette Lock is saved with the sprite. Pasting, moving and transforming pixels, and the
adjustments in the Filter menu, aren't snapped.

## The Palette Library

The **Library** button opens the Palette Library, with two tabs.

**Built-in** lists the palettes that come with the editor: classic consoles and computers, and
popular palettes from Lospec, each credited to its author. They work offline and signed out.
Search by name or tag, then:

- **Use** replaces the sprite's palette with it; **Append** adds its colors.
- The save button saves a copy to My Palettes, keeping the credit.
- **Find more on Lospec** opens [Lospec's palette list](https://lospec.com/palette-list); import
  one from My Palettes.

**My Palettes** holds palettes you've saved. They're yours alone; with Sync they're kept in your
account too.

- **Save to My Palettes** saves the sprite's current palette under a name.
- **Load** replaces the sprite's palette with a saved one; **Append** adds only the colors it
  doesn't have yet.
- **Import...** reads `.gpl` (GIMP), `.pal` (JASC), `.hex`, `.txt` (Paint.NET), `.act`,
  `.aco` and `.ase` (Adobe Photoshop and Swatch Exchange; CMYK and Lab swatches are converted
  without a color profile), Aseprite files, and images (every distinct color, in reading order).
- **Import from Lospec** takes a palette's name or address on lospec.com, for example
  `endesga-32`. **Find more on Lospec** beside it opens Lospec's palette list.
- **Export** saves the palette as `.gpl`, `.pal`, `.hex`, `.act`, `.aco`, `.ase`, or a `.png`
  strip with one pixel per color. `.hex`, `.png`, `.gpl` and `.pal` keep transparency (`.gpl` and `.pal` the way
  Aseprite writes it); `.act` keeps only one transparent color, and `.aco` and `.ase` keep none.

Loading a library palette copies its colors into the sprite: changing the library palette later
doesn't change sprites that already use it. On an indexed sprite, loading replaces the colors slot
by slot and every pixel keeps its entry number, so the art shows the new colors (a palette swap).
If the loaded palette is shorter than the entries the pixels use, those entries keep their old
colors.

## Color modes

A sprite's color mode decides how its pixels store color. Choose it when you make the sprite, or
convert later with Sprite > Convert to RGB Color, Sprite > Convert to Grayscale or
Sprite > Convert to Indexed Color... (also in File > Rename Sprite...).

- **RGBA** stores a full color, with transparency, in every pixel. The palette is a set of
  swatches to pick from.
- **Grayscale** stores a shade of gray and its transparency.
- **Indexed** stores, in every pixel, the number of a palette entry (up to 256). Change an entry
  and every pixel that uses it changes color; reorder or sort the palette and the pixels follow
  their colors; remove an entry and its pixels become transparent.

Sprite > Convert to Indexed Color... opens a dialog with a live preview of the active cel:

- **Palette:** **Keep the current palette** (set it up first; if its transparent entry, the
  first one by default, is a visible color, the palette's first fully transparent color becomes
  the transparent entry instead, or, with none, a transparent entry is inserted before it so that
  color stays; only the first 256 colors are kept), or **Generate from the sprite**
  with up to **Colors** (2 to 256) picked from the sprite's own pixels. A generated palette
  replaces the current one, including palettes that change over time; its first entry is
  transparent unless the Background is the only layer.
- **Dithering:** **None** snaps every pixel to its nearest palette color. The ordered patterns
  (**Bayer 2x2**, **4x4**, **8x8**) mix the two nearest colors in a regular grid that stays put
  from frame to frame, which suits animation. **Floyd-Steinberg** and **Atkinson** spread each
  pixel's error to its neighbors for a smoother, grainier look; Atkinson keeps highlights and
  shadows cleaner. Error diffusion can shimmer in animation, because a small change moves the
  grain.
- **Amount** (0 to 100): how strongly to dither.

Pixels that are almost fully transparent (alpha under 8 out of 255) become transparent, and a
visible pixel never lands on a fully transparent palette color. Converting to grayscale drops the
color: each pixel keeps its brightness as Aseprite measures it (the Rec. 709 weights, so pure red
becomes 54, green 182 and blue 18 out of 255). It also replaces the palette with 256 grays, black
to white, and drops palettes that change over time and palette groups, so converting on to
indexed maps grays onto grays. Both can be undone; converting from indexed to RGBA loses nothing.

In an indexed sprite, one palette entry stands for **transparent**: the first, unless you change
**Transparent Color** in File > Rename Sprite.... It moves with its entry when you add, remove,
reorder or sort colors. If you remove the transparent entry itself, its pixels stay transparent:
another fully transparent color takes over, or, with none, the slot just after the last color.

## Color depth

Sprite > Color Depth... pins the sprite to a hardware color profile, the way a Mega Drive could
only show 8 levels of each of red, green and blue. Pick a preset (generic depths like RGB565,
consoles by maker, home computers), or **Custom** for your own number of **bits** or **levels**
per channel, in color or grayscale. The dialog shows a banded preview of what the profile allows,
how many colors that is, and, for a level count of 16 or fewer, the exact values.

Applying folds every pixel on every layer and frame, the tiles, the palette (and palettes that
change over time) and the foreground and background colors into the profile, as one undo step.
In an indexed sprite only the palette changes: the pixels keep their entries. A grayscale profile
turns every color into a gray; a grayscale sprite takes grayscale profiles only.

After that the sprite stays on its profile: whatever you draw, fill, paste, transform, adjust,
import or run from a script lands on an allowed color, and so do palette edits, the color picker
(its sliders show the steps as bands), the eyedropper and Replace Color. Layer effects and
adjustment layers show only allowed colors too, so baking them changes nothing on screen. The
active profile shows above the color picker and in File > Rename Sprite....

**None (8-bit)** removes the profile. Colors stay as they are: the precision the fold dropped
doesn't come back (use Undo for that). Reference layers are left alone, and blending translucent
pixels or layers with opacity and blend modes can still mix colors between the steps on screen,
as in an indexed sprite.

Choosing a console in File > New Sprite...'s **Consoles** tab offers its color depth and, for systems
with a fixed palette such as the NES or PICO-8, its palette. The profile is saved in `.pxstudio`
files; an Aseprite export writes the pixels as they are, and opening it here pins the sprite again.
Each level of an n-bit channel is evenly spaced from 0 to 255 (3 bits: 0, 36, 73, 109, 146, 182,
219, 255). Some hardware isn't quite linear; the notes say where the profile approximates it.

| Profile | Group | Color depth | Colors | Notes |
| - | - | - | - | - |
| **RGB565** | Generic | 5-6-5 bits | 65536 | 16-bit high color: 5 bits of red and blue, 6 of green. |
| **RGB444** | Generic | 4-4-4 bits | 4096 | 12-bit color, 4 bits a channel (the Amiga's). |
| **RGB332** | Generic | 3-3-2 bits | 256 | 8-bit color: 3 bits of red and green, 2 of blue. |
| **Grayscale 8-bit** | Generic | 8-bit gray | 256 | 256 grays. |
| **Grayscale 4-bit** | Generic | 4-bit gray | 16 | 16 grays. |
| **Grayscale 2-bit** | Generic | 2-bit gray | 4 | 4 grays. |
| **Grayscale 1-bit** | Generic | 1-bit gray | 2 | Black and white. |
| **Game Boy** | Nintendo | 2-bit gray | 4 | 4 shades of an LCD green: 2-bit grayscale, or the green palette. |
| **Game Boy Color** | Nintendo | 5-5-5 bits | 32768 | 15-bit color, 5 bits a channel. |
| **Game Boy Advance** | Nintendo | 5-5-5 bits | 32768 | 15-bit color, 5 bits a channel. |
| **NES** | Nintendo | Fixed palette | | A fixed palette of about 54 colors. |
| **SNES** | Nintendo | 5-5-5 bits | 32768 | 15-bit color, 5 bits a channel. |
| **Nintendo DS** | Nintendo | 5-5-5 bits | 32768 | 15-bit color for 2D graphics, 5 bits a channel. |
| **Master System** | Sega | 2-2-2 bits | 64 | 6-bit color, 2 bits a channel: 64 colors. |
| **Mega Drive / Genesis** | Sega | 3-3-3 bits | 512 | 9-bit color, 3 bits a channel: 512 colors. Evenly spaced levels; the real ramp bows a little. |
| **Game Gear** | Sega | 4-4-4 bits | 4096 | 12-bit color, 4 bits a channel. |
| **PlayStation** | Sony | 5-5-5 bits | 32768 | 15-bit color, 5 bits a channel (24-bit only for video). |
| **Atari Lynx** | Atari | 4-4-4 bits | 4096 | 12-bit color, 4 bits a channel. |
| **Neo Geo Pocket Color** | Other Handhelds | 4-4-4 bits | 4096 | 12-bit color, 4 bits a channel. |
| **WonderSwan Color** | Other Handhelds | 4-4-4 bits | 4096 | 12-bit color, 4 bits a channel. |
| **Playdate** | Other Handhelds | 1-bit gray | 2 | Black and white. |
| **PC Engine / TurboGrafx-16** | Other Consoles | 3-3-3 bits | 512 | 9-bit color, 3 bits a channel: 512 colors. |
| **Neo Geo** | Other Consoles | 5-5-5 bits | 32768 | Approximated as 15-bit color: the hardware adds a shared dark bit. |
| **Commodore 64** | Home Computers | Fixed palette | | A fixed palette of 16 colors. |
| **Amiga OCS/ECS** | Home Computers | 4-4-4 bits | 4096 | 12-bit color, 4 bits a channel: 4096 colors. |
| **Atari ST** | Home Computers | 3-3-3 bits | 512 | 9-bit color, 3 bits a channel: 512 colors. |
| **Atari STE** | Home Computers | 4-4-4 bits | 4096 | 12-bit color, 4 bits a channel. |
| **Amstrad CPC** | Home Computers | 3-3-3 levels | 27 | 27 colors: each gun off, half or full. |
| **IBM CGA** | Home Computers | Fixed palette | | A fixed palette of 16 colors (4 at a time at 320x200). |
| **PC VGA (Mode 13h)** | Home Computers | 6-6-6 bits | 262144 | 18-bit color, 6 bits a channel (256 at a time). |
| **PICO-8** | Fantasy Consoles | Fixed palette | | A fixed palette of 16 colors. |
| **TIC-80** | Fantasy Consoles | Fixed palette | | 16 colors, Sweetie 16 by default. |

## Palettes that change over time

In a sprite with more than one frame, the palette panel can start a **new palette from this
frame**: a copy of the current one that applies from that frame until the next change. Edits then
change only that stretch of the animation. **Remove** goes back to the palette before it.

**Color cycling** (indexed sprites) rotates a range of palette colors while the animation plays,
for water, fire and flashing lights, without touching any pixels. Add a cycle, choose its first and
last palette index, its direction and how many frames each step lasts, and press Play to see it.
Cycles are saved in `.pxstudio` files only; **Bake into frames** turns them into per-frame palettes
(adding frames if needed) so they show up in exported GIFs and videos.

## Shades for the Shading ink

The Shading ink moves pixels along a list of colors, its **Shades**. With the ink set to Shading,
the tool options show the list: drag palette colors into it, press **+ FG** to add the foreground
color, drag to reorder, and click a color to remove it. Selecting a range in the palette while the
list is empty fills it, as does the palette's **Shading ramp** button. The left button shifts
pixels forward along the list and the right button back.