Create Your First RPG Character Sprite

Design a 32x32 RPG character sprite with shading and idle animation.

Introduction

30 Second Summary

Every RPG character you've loved started as a tiny grid of colored squares. The difference between amateur sprites and ones that feel alive in games like Sea of Stars comes down to a handful of specific techniques that professional pixel artists use.

In this project, you will create a 32x32 pixel art RPG character sprite with hue-shifted shading, directional lighting, and a breathing idle animation. You will export it as a game-ready sprite sheet that drops straight into any game engine.

What You'll Build

When you're done, you'll have a 32-pixel character that gently breathes on screen and drops straight into Unity, Godot, or any game engine as a ready-to-use sprite sheet.

By the end of this project, you'll have:

A character that reads clearly even at tiny sizes, because you designed it silhouette-first with hue-shifted color ramps that give it the rich depth of Sea of Stars-style art.
Three-dimensional form from directional shading with a consistent light source, giving your character real volume and weight.
A breathing idle animation using onion skinning, exported as a PNG sprite sheet you can import directly into Unity, Godot, or any game engine.
Secret Mission: Build a complete 4-direction walk cycle and export a 16-frame sprite sheet for full RPG movement.

Do I need any prior pixel art experience?

No prior experience needed. This project starts from scratch and walks you through every technique step by step.

You should have LibreSprite installed on your computer. Step 1 handles the full workspace configuration for pixel art.

Before We Start

Before we dive in, let's lock in what you're about to build and why it matters. Deciding on your character's role and visual identity now gives every design decision a clear purpose throughout the project.

Set Up Your Pixel Art Workspace

LibreSprite's default settings are designed for general illustration work. Without configuring it for pixel art, you will get blurry edges, invisible grid lines, and tools that fight against precise pixel placement.

In this step, you will create a fresh 32x32 canvas and configure LibreSprite specifically for pixel-level precision. You will also create a layer structure that keeps your outline, color, and shading work organized from the start.

In this step, get ready to:

Create a new 32x32 transparent sprite.
Configure zoom, grid, and pencil settings for pixel-perfect editing.
Set up separate layers for outline, color, and shading.

Create a new 32x32 sprite

A 32x32 canvas gives you enough room for expressive characters with facial details and equipment, while staying within the modernized 16-bit aesthetic.

In LibreSprite, click File in the top menu bar.
Click New Sprite.
In the dialog that appears, set Width to 32 and Height to 32.
Set Color Mode to RGBA.
Set Background to Transparent.
Click OK.

A tiny checkered canvas appears in the editor. The checkerboard pattern indicates transparency.

Why RGBA and transparent background?

RGBA stores a full color spectrum plus an alpha (transparency) channel. A transparent background means your character will have no colored box behind it when you import the sprite into a game engine.

Don't see the canvas?

Make sure you clicked OK in the New Sprite dialog. If the dialog is still open, double-check that Width and Height are both set to 32.

Help me create a new sprite in LibreSprite

Configure the workspace for pixel art

At the default zoom level your 32x32 canvas is barely visible. You need to zoom in, reveal the pixel grid, and configure the pencil tool so every stroke lands exactly one pixel wide with no anti-aliasing.

Click View in the top menu bar.
Click Show Grid to enable it. A faint grid overlay appears on the canvas, marking every pixel boundary.
Zoom in to 800-1600% so individual pixels are clearly visible. Use the scroll wheel to zoom, or go to View and click Zoom In repeatedly.
Select the Pencil tool from the toolbar on the left side (it looks like a pencil icon).
In the tool options bar at the top, set the brush size to 1 pixel.
Check the Pixel Perfect checkbox in the tool options. This prevents unwanted double pixels on diagonal strokes.

You should now see a zoomed-in grid where each square represents exactly one pixel.

What does Pixel Perfect mode do?

When you draw diagonal lines freehand, the pencil can accidentally place two pixels side by side at corners, creating a chunky staircase. Pixel Perfect mode automatically removes those doubles so your strokes stay crisp and one pixel wide.

Grid not showing up?

Make sure you have zoomed in enough. At low zoom levels the grid lines are too close together to render. Try zooming to at least 800%.

Help me enable the pixel grid in LibreSprite

Create your layer structure

Professional pixel artists separate their work onto dedicated layers. This lets you edit outlines without accidentally smearing colors, or adjust shading without touching the base fill.

Locate the Timeline panel at the bottom of the screen. This shows your animation frames.
Locate the Layers section on the left side of the Timeline. You should see one default layer listed there.
Right-click the existing layer in the layers panel and select Properties.
Rename it to Shading and click OK.
Click Layer in the top menu bar.
Click New Layer. Name it Color and click OK.
Click Layer in the top menu, then New Layer again. Name it Outline and click OK.

Your layers panel should now show three layers from top to bottom: Outline, Color, Shading.

Why three separate layers?

The Outline layer sits on top so your character's border is always visible. The Color layer holds flat base fills. The Shading layer goes between them so shadows and highlights blend with the color without affecting the crisp outline.

This order lets you lock or hide any layer independently. You can paint freely on one without accidentally changing another.

Layers in the wrong order?

If your layers are not in the order Outline (top), Color (middle), Shading (bottom), you can drag them in the layers panel to rearrange. Click and hold a layer name, then drag it up or down.

Help me reorder layers in LibreSprite

Before you move on, what do you think will happen when you click on the canvas and draw a single pixel?

Make sure the Outline layer is selected (click on it in the layers panel).
Click anywhere on the canvas to place a few pixels.
Each pixel should snap cleanly to the grid with no anti-aliasing or blurring. You see a sharp, solid square of color in each grid cell you click.

If your pixels look crisp and land one per grid cell, your workspace is properly configured.

Undo your test pixels by pressing Ctrl+Z a few times until the canvas is clear again.

Your pixel art workspace is ready to go. Next up, you will design your character's silhouette, the single most important foundation for a readable sprite.

Design Your Character Silhouette

Your workspace is configured and your layers are ready. Now comes the most important creative decision for your entire sprite: the silhouette.

A character that reads by silhouette alone will be recognizable at any zoom level, against any background, and in motion. If the silhouette is muddled, no amount of shading or color will fix it.

In this step, get ready to:

Plan your character's proportions with a stick figure guide.
Block in the full silhouette shape and test it at 100% zoom.
Clean up the outline to a smooth 1-pixel border.

Plan proportions with a stick figure

Before drawing any detail, you need a proportion guide. At 32x32 pixels, every single pixel matters. A stick figure locks in your character's height, limb placement, and stance before you commit to a full shape.

Select the Outline layer in the Layers panel on the right side of the screen.
Click the foreground color swatch (the colored square near the bottom-left of the toolbar) and pick a bright contrasting color like red or green. This is a temporary guide color you will erase later.
With the Pencil tool still selected at 1px brush size, sketch a simple stick figure in the center of the canvas.
Make the head roughly 8-10 pixels tall.
Make the body 14-16 pixels below the head, leaving a few pixels at the bottom for feet. This gives you a 2.5-3 head-to-body ratio.
Decide what role your character plays and shape the pose accordingly. A warrior needs wide shoulders. A mage needs a triangular robe shape. An archer needs a slim frame with a curved bow line.

You should see a rough stick figure centered on your canvas in a bright, easy-to-spot color.

Why start with a stick figure?

At 32x32, you have very few pixels to work with. Jumping straight into detail means you will run out of space for legs or accidentally make the head too small. The stick figure acts as scaffolding that keeps proportions locked before you build the real shape on top.

Block in the silhouette

The stick figure gave you structure. Now you will fill in the actual character shape as a single solid mass, turning that skeleton into a readable form.

Click the foreground color swatch and switch to a dark color (near-black, like #1a1a2e).
On the same Outline layer, paint over your stick figure, filling in the full character shape as a solid mass.
Focus on the distinguishing feature that makes your character's role obvious. A warrior's broad shoulders and sword. A mage's wide-brimmed hat or flowing robe. An archer's quiver or bow curve.
If the shape looks like a generic human blob, exaggerate the distinguishing feature. Make the hat bigger, the sword wider, or the robe longer.

Before you move on, you need to test whether your silhouette actually communicates. What do you think you will see when you zoom out to 100%?

Zoom out to 100% by scrolling your mouse wheel down (or use View > Zoom Out repeatedly) until the sprite appears at its actual tiny size.
Look at the dark shape. Can you immediately tell what kind of character it is?

If the shape reads clearly as your chosen role, you are on track. If it looks like an unrecognizable blob, zoom back in and exaggerate the key feature until it pops.

Zoom back in to 800-1600% by scrolling up (or View > Zoom In) so you can continue editing at pixel level.

Shape looks unrecognizable at 100%?

The most common fix is to exaggerate one silhouette feature. Double the width of the hat, extend the weapon past the body outline, or widen the stance. Subtlety does not work at 32x32.
Make sure no two body parts merge into a single rectangular mass. Leave at least 1 pixel of separation between arms and torso so limbs read as separate shapes.
Still struggling? Help me make my 32x32 silhouette more readable. My character is a [role] but it looks like a generic blob at 100% zoom.

Clean up the outline

Your silhouette shape is blocked in, but the edges are likely jagged and rough. A clean 1-pixel outline makes the character look polished and separates it clearly from any background.

Trace a clean 1-pixel-wide border around the entire silhouette. Every edge should be exactly 1 pixel thick.
Smooth out jagged diagonal lines using bridge pixels. Where a staircase pattern looks choppy (like a 1-1-1-1 step pattern), add pixels to create a smoother step like 1-2-1 or 1-2-3-2-1. This makes curves read as smooth instead of staircased.
Delete the bright-colored stick figure sketch underneath. Select the bright guide color with the eyedropper, then erase or paint over those pixels with your dark outline color.
Check that no stick figure pixels remain. Only the clean dark outline should be left on the Outline layer.

What are bridge pixels?

When you draw a diagonal line pixel by pixel, it creates a staircase pattern. Bridge pixels fill the gaps between steps to create the illusion of a smooth curve. Instead of stepping 1 pixel at a time in both directions, you hold one direction for 2-3 pixels before stepping. This is one of the core techniques that makes pixel art look clean rather than jagged.

Time for the final silhouette test. Do you think your cleaned-up character will still read clearly, or did the cleanup change how it looks at small size?

Select all content on the Outline layer by pressing Ctrl+A.
Zoom out to 100% one more time.
Look at the silhouette. You should immediately be able to tell what kind of character this is from the dark shape alone.

Your Outline layer now has a clean, closed silhouette with smooth bridge pixels on diagonals. The Color and Shading layers are still empty, waiting for the next steps.

Outline looks too thick or uneven?

Make sure your brush size is set to 1px. A 2px brush doubles every stroke and creates unintentionally thick outlines.
Check that pixel-perfect is still enabled in the tool options bar. Without it, diagonal strokes can deposit double pixels at corners.
If some sections are 2 pixels wide, zoom in and erase the extra pixel from the inside edge. The outline should always be exactly 1 pixel.
Need help cleaning up? Help me fix my pixel art outline thickness and smoothness.

Zoom back in to your working zoom level (800-1600%).
Save your sprite by pressing Ctrl+S (or File > Save).

Your silhouette is locked in and readable. Next up, you will fill it with flat base colors to separate the character into distinct zones like skin, hair, and clothing.

Fill with Flat Base Colors

Your character silhouette is locked in and reads clearly as a recognizable role even at tiny sizes.

Now it's time to add color. Flat color blocking separates the character into distinct readable zones like skin, hair, and clothing. At the end of this step, you'll see exactly why flat colors alone look lifeless and why your character needs something more.

In this step, get ready to:

Choose 4-6 saturated base colors for your character zones.
Fill each zone with flat color on the Color layer.

Choose your base colors

Every distinct area of your character needs its own color. Think of these as the major zones: skin, hair, primary clothing, secondary clothing, weapon or accessory, and eyes.

In the Layers panel, click on the Color layer to select it.
Confirm this layer sits below the Outline layer in the stack. Your outline will stay visible on top of the color fill.
Double-click the foreground color swatch (the colored square in the toolbar) to open the color picker.
Pick your first base color. For a Sea of Stars-inspired RPG character, choose saturated, bold colors. Avoid pastels or muddy mid-tones.
You can type hex values directly into the color picker for precision.
Choose 4-6 total base colors, one per character zone: skin, hair, primary clothing, secondary clothing, weapon or accessory, and eyes.

How many colors should I pick?

For a 32x32 RPG character, 4-6 base colors is the sweet spot. Each base color will later become a 3-color ramp (highlight, base, shadow), giving you roughly 12-18 total colors in your finished palette.

Make sure no two adjacent zones use similar colors. If your character's shirt and pants are both blue, they'll blur together at small sizes.

Fill each zone with flat color

With your colors chosen, it's time to paint them onto the canvas. You'll fill the inside of your character's silhouette zone by zone.

Make sure you're still on the Color layer.
Select your first zone color from the foreground swatch.
Use the Fill (bucket) tool to click inside a closed zone, or use the Pencil tool to manually paint pixels if the zone isn't fully enclosed.
Repeat for each zone. Switch your foreground color, then fill or paint the next area.
Check that the Outline layer on top still cleanly separates all your color zones.

Fill tool not working?

The Fill tool only fills within closed outlines on the same layer. Since your outline lives on a separate layer, the Fill tool on the Color layer will flood the entire canvas. If this happens, undo with Ctrl+Z and use the Pencil tool to paint pixels manually instead.

Before you zoom out, take a guess. What do you think your character will look like with only flat colors and no shading?

Zoom out to 100% using View > Zoom > Fit Screen or scrolling your mouse wheel down.
Look at your character at this small size.

Your character reads clearly. You can tell the zones apart. But it looks like a flat paper cutout with no sense of form, volume, or light direction.

Why does it look so flat?

Flat base colors give you readable zones, but they tell the viewer nothing about the character's shape in 3D space. There's no indication of where light hits or where shadows fall.

This is the exact problem that hue-shifted shading solves in the next step. The flat sticker look you're seeing now is the "before" picture.

Colors look muddy or zones blend together?

If two adjacent zones are hard to tell apart at 100% zoom, swap one of them for a more contrasting color. Readability at small sizes is the goal.

If the whole character looks washed out, increase the saturation of your base colors. Bold, punchy colors work best before you add shading.

Help me pick better base colors for my RPG character sprite.

Your character has a clean silhouette and distinct color zones. It reads clearly, but it also looks completely flat. In the next step, you'll build hue-shifted color ramps and apply directional shading to give your sprite real depth and dimension.

Build Color Ramps and Apply Directional Shading

Your character has clean flat colors in every zone, but zoom out and the problem is obvious. It looks like a paper cutout with zero depth.

Sea of Stars sprites feel three-dimensional because they use hue-shifted color ramps and consistent directional lighting. This single technique is what separates amateur pixel art from professional work, and you are about to learn it.

In this step, get ready to:

Build a hue-shifted 3-color ramp for each base color zone.
Apply directional shading from a top-left light source.
Polish the sprite with selective outlining to integrate shading with the outline.

Build hue-shifted color ramps

Flat shading means making shadows darker and highlights brighter. Hue-shifted shading does something more powerful: it shifts the actual color toward cooler tones for shadows and warmer tones for highlights.

What is hue shifting?

In hue-shifted color ramps, shadows shift toward cool tones (blue and purple) while highlights shift toward warm tones (yellow and orange). You also decrease brightness and slightly increase saturation for shadows.

For example, a red shirt base becomes orange-shifted for the highlight and purple-shifted for the shadow. A green cloak shifts toward yellow for highlights and toward teal for shadows. This creates richer, more lifelike color depth than simply adjusting brightness alone.

In LibreSprite, make sure you are on the Color layer.
Double-click the foreground color swatch to open the color picker.
For each of your 4-6 base colors, create a 3-color ramp: Highlight, Base, Shadow.
For each shadow color: take the base, decrease brightness, slightly increase saturation, and shift the hue toward blue or purple.
For each highlight color: take the base, increase brightness, and shift the hue toward yellow or orange.
Add each new color to your palette by clicking an empty slot in the palette panel and setting it to the color you created.

You should now have roughly 12-18 colors total in your palette (3 per zone).

Save your palette for reuse in future sprites by saving the sprite file (File > Save As as palette.ase) so the palette is preserved inside the file.

Why save the palette separately?

This palette file becomes your reusable color reference. Every future character, NPC, or enemy in your game can load this same palette to keep a consistent visual style.

Check your palette panel. You should see your colors organized into clear warm-to-cool ramps for each zone.

Colors all look the same?

If your shadows and highlights are hard to distinguish from the base, you are probably only adjusting brightness. Make sure you are shifting the hue slider (not just the value/brightness slider) when creating shadows and highlights.

A good test: your shadow should look noticeably bluer or purpler than the base, and your highlight should look warmer and more golden. Help me make my color ramps look more distinct

Apply shadows and highlights with a consistent light source

Now that you have your color ramps, it is time to paint light and shadow onto the character. You will commit to a single light direction so every surface on the character reacts consistently.

Select the Shading layer in the layers panel (it should be between the Color layer and the Outline layer).
Select the Pencil tool with brush size 1.
Commit to top-left lighting (this is the standard for RPG sprites).
Apply highlight colors to surfaces facing up-left: top of head, left shoulder, top of arms, front of clothing.
Apply shadow colors to surfaces facing away from the light: right side of body, under chin, under arms, bottom of clothing folds, between legs.

What is top-left lighting?

Imagine the sun is shining from the top-left corner of the canvas. Every surface angled toward that corner catches the highlight. Every surface angled away from it falls into shadow.

For 32x32 sprites, use all 3 value stages per zone (Highlight, Base, and Shadow). This is the sweet spot between showing depth and avoiding clutter at this small size.

Sprite looks puffy or bloated?

If your shading wraps evenly around every edge instead of following a direction, you may be pillow shading. Pillow shading places shadows uniformly along the outline with no discernible light source, creating an unnatural puffy look.

The fix: pick one direction (top-left) and be strict. Highlights go ONLY on surfaces facing top-left. Shadows go ONLY on surfaces facing bottom-right. Help me fix pillow shading on my sprite

Zoom out to 100% and compare your sprite now to the flat-colored version from Step 3. The difference should be dramatic: one side catches light, the other falls away into shadow, and the character looks three-dimensional.

Add selective outlining

A uniform black outline flattens the sprite by creating a hard boundary everywhere. Selective outlining (sel-out) softens this by making the outline react to the same light source as your shading.

Switch to the Outline layer.
Where light hits (top-left edges): change the outline color to a darker version of the adjacent highlight color.
Where shadow falls (bottom-right edges): keep the outline very dark (near-black is fine).
Work around the entire character, adjusting outline pixels to match the zone they border.

Why does this work?

Selective outlining is especially effective for characters 32x32 and larger. It creates a softer, more integrated look by letting the outline participate in the lighting instead of fighting it.

Uniform black outlines everywhere flatten the sprite because they create the same visual weight on all edges. With sel-out, lit edges recede and shadowed edges stay sharp, adding another layer of depth.

Test the difference: toggle the Outline layer visibility off and on by clicking the eye icon next to it in the layers panel.
The sel-out version should feel noticeably more dimensional and polished than a uniform black outline.

Before you zoom out for the final check, take a guess: how much of a difference do you think hue-shifted shading and sel-out made compared to the flat version?

Zoom out to 100%.
Save your sprite file (Ctrl+S).

Your character now has visible depth. The side facing the light source is brighter and warmer, the opposite side is darker and cooler.

Character still looks flat?

Make sure your highlight and shadow colors are different hues from the base, not just lighter and darker versions of the same hue. The hue shift is what creates the sense of real light and depth.

Also check that your Shading layer is visible and positioned between the Color and Outline layers. If it is above the Outline layer, the shading will cover your outlines. Help me troubleshoot my shading layer order

Your character has real depth now. Next up, you will bring it to life with a 4-frame idle breathing animation.

Animate a 4-Frame Idle

Your character now has depth, dimension, and a professional-quality color palette. It looks great as a still image.

A static sprite feels dead in a game world. Even a subtle breathing bob makes a character feel alive and present in the scene. In this step, you will create a 4-frame idle animation and export it as a game-ready sprite sheet.

In this step, get ready to:

Set up 4 animation frames with custom durations and enable onion skinning.
Create a breathing motion by shifting the character up and down by 1 pixel.
Export the finished animation as a PNG sprite sheet.

Set up frames and enable onion skinning

Animation in LibreSprite works frame by frame. You will duplicate your current sprite into 4 frames, then assign different durations to control the rhythm of the breathing motion.

In the Timeline panel at the bottom of LibreSprite, right-click the current frame (Frame 1).
Select New Frame from the context menu.
Repeat this two more times so you have 4 identical frames total in the Timeline.

You should now see 4 frame thumbnails in the Timeline panel.

Right-click Frame 1 and select Frame Properties.
Set the duration to 200 milliseconds. This is a resting position, so it holds slightly longer.
Right-click Frame 2 and set its duration to 150 milliseconds.
Right-click Frame 3 and set its duration to 200 milliseconds.
Right-click Frame 4 and set its duration to 150 milliseconds.

Why different durations?

The resting frames (1 and 3) hold at 200ms so the character lingers at neutral. The motion frames (2 and 4) play at 150ms for a snappier feel as the character moves.

This rhythm makes the breathing look natural rather than robotic.

Enable onion skinning by clicking the onion skin icon in the Timeline toolbar, or by clicking View, then selecting Show Onion Skin.

You should see faint ghost outlines of adjacent frames overlaid on your canvas. These help you judge the motion difference between frames.

What is onion skinning?

Onion skinning shows translucent versions of the previous and next frames on top of your current frame. It lets you see exactly how far things move between frames so you can keep motion smooth and consistent.

Don't see the ghost outlines?

Make sure the Timeline panel is visible at the bottom of your workspace. The onion skin icon is a small circular icon in the Timeline toolbar. Click it until the ghost frames appear on your canvas.

If the Timeline is hidden, click View, then select Timeline to show it.

Help me troubleshoot onion skinning in LibreSprite

Create the breathing motion

The breathing pattern is simple: neutral position, shift up 1 pixel, back to neutral, shift down 1 pixel. This creates a gentle bob that loops forever.

Click on Frame 1 in the Timeline. This is your neutral position. Leave it exactly as it is.
Click on Frame 2 in the Timeline.
Select all content across all layers by pressing Ctrl+A.
Press the Up arrow key once to shift everything up by 1 pixel. This is the inhale peak.

With onion skinning on, you should see the ghost of Frame 1 sitting 1 pixel below your current content. This confirms the shift worked.

Click on Frame 3 in the Timeline.
Frame 3 should match Frame 1 (neutral position). If it already does, leave it. If it shifted when you edited Frame 2, undo and re-duplicate from Frame 1.
Click on Frame 4 in the Timeline.
Select all content across all layers by pressing Ctrl+A.
Press the Down arrow key once to shift everything down by 1 pixel from neutral. This is the exhale low point.

What does the full motion look like?

The loop plays as: neutral (Frame 1), up 1px (Frame 2), neutral (Frame 3), down 1px (Frame 4), back to Frame 1. This creates a continuous gentle breathing bob.

Before you press Play, what do you expect to see? Think about how these 4 frames connect to each other in sequence.

Press the Play button in the Timeline (or press Enter) to preview your animation.

Your character gently bobs up and down with a smooth breathing rhythm. It loops seamlessly without any jarring jump between the last and first frame.

Animation looks jerky or jumps?

Check that Frame 1 and Frame 3 are identical (both neutral). If Frame 3 is offset, the loop will stutter at that transition.

Also verify your frame durations: 200ms for frames 1 and 3, 150ms for frames 2 and 4. If the character shifts too far, make sure you only pressed the arrow key once per frame (1 pixel, not 2).

Help me fix my idle animation loop

Export the sprite sheet

Game engines do not read LibreSprite files directly. You need to export your animation as a single PNG image containing all frames laid out side by side.

Click File, then select Export Sprite Sheet.
Set Sheet Type to Horizontal Strip (all 4 frames in a row).
Set the output file name to hero_idle.png and choose a location you can find easily.
Click Export.

What does this produce?

The export creates a 128x32 PNG image. That is your 4 frames of 32x32 pixels placed side by side in a single row. This format is directly importable into any game engine.

In Unity, set Sprite Mode to Multiple, Pixels Per Unit to 32, and Filter Mode to Point. In Godot, set the texture filter to Nearest. Both settings prevent blurry upscaling of your pixel art.

Open the folder where you saved the file.
Confirm that hero_idle.png exists and is 128 pixels wide by 32 pixels tall.

Export file looks wrong or is missing?

Make sure you selected Horizontal Strip as the sheet type. Other options like Grid will produce different dimensions. If the file is 32x128 instead of 128x32, you may have selected Vertical Strip by mistake.

Help me fix my sprite sheet export

Secret mission

Create a 4-Direction Walk Cycle

Your character can breathe, but can they move? Every RPG needs walk cycles. Build a complete 4-direction walk cycle with 16 frames of purposeful animation and export it as a game-ready sprite sheet.

Clean Up Your Resources

Decide whether to keep your resources running, pause them to come back later, or delete them entirely. This project runs entirely locally with no paid services, so there are no ongoing costs.

Resources you used:

LibreSprite (installed desktop application).
Local sprite files: hero_idle.ase, hero_idle.png, hero_walk.ase, hero_walk.png, and palette.ase.

Keep everything running

No action needed. Choose this if you are still actively building your game or plan to create more characters using the same workflow.

Organize your sprite files into a dedicated project folder (e.g. my-rpg/assets/characters/) so they are easy to find when you import them into a game engine.
Keep your palette.ase file saved separately alongside your sprites. Load it into every new character sprite to maintain a consistent color palette across your game.
LibreSprite stays installed and ready for your next sprite session.

Pause - I'll come back to this later

Close LibreSprite to free up memory. Your files remain on disk and ready to reopen whenever you return.

Save any open work in LibreSprite, then close the application.
Back up your sprite files to cloud storage (Google Drive, OneDrive, Dropbox) or a Git repository if you want version history.
Note the folder location where your files are saved so you can find them later.

Delete - I don't want to use this again

Remove all project files and uninstall LibreSprite from your machine.

Delete your sprite files. Open File Explorer and navigate to the folder where you saved your sprites. Select all the project files (hero_idle.ase, hero_idle.png, hero_walk.ase, hero_walk.png, palette.ase) and delete them.
Uninstall LibreSprite. Press the Windows key and type Add or remove programs.
Find LibreSprite in the list, click it, then click Uninstall.
Follow the uninstall prompts to complete removal.

Nice Work!

You just built a game-ready RPG character sprite from scratch. Your character has professional-quality shading, a custom palette, and a living idle animation ready to drop into any game engine.

You've learned how to:

Build a custom hue-shifted color palette and apply directional shading from a consistent light source, giving your sprite the rich depth of Sea of Stars-style pixel art.
Design a character silhouette-first so it reads clearly at any size, then polish it with selective outlining for a dimensional, integrated look.
Animate a 4-frame idle breathing cycle using onion skinning and export a game-ready PNG sprite sheet compatible with Unity, Godot, and other engines.
Secret Mission: Created a complete 4-direction walk cycle with 16 frames of purposeful animation exported as a single sprite sheet.

Ready to quiz yourself?