Skip to main content

​
Overview

Tiled Mode allows you to draw seamless, repeating patterns by showing your sprite tiled across the canvas. What you draw on one edge automatically wraps to the opposite edge, making it perfect for game backgrounds, textures, and repeating elements.
Tiled Mode demonstration
Tiled Mode is essential for creating game assets like terrain tiles, background patterns, and any texture that needs to repeat seamlessly.

​
Enabling Tiled Mode

1

Access View Menu

Navigate to View → Tiled Mode to see the tiling options.
2

Choose Tiling Direction

Select how you want your sprite to tile:
  • None: Standard mode (no tiling)
  • Horizontal: Tiles left-right
  • Vertical: Tiles top-bottom
  • Both: Tiles in all directions
3

Start Drawing

Draw on your canvas and watch the edges wrap seamlessly.
Use Shift + T to quickly toggle between tiled modes.

​
Tiling Modes

Use case: Side-scrolling game backgrounds, horizontal bordersYour sprite repeats left to right. Drawing on the right edge appears on the left edge.
-- Enable horizontal tiling via script
app.command.TiledMode { axis = "horizontal" }

Sky Backgrounds

Create endless sky textures for platformers

Ground Textures

Make seamless floor and ground patterns

​
Creating Seamless Patterns

​
Basic Pattern Workflow

1

Create a square canvas

Start with a square sprite for best results. Common sizes: 16×16, 32×32, 64×64, 128×128.
aseprite --batch --new 32,32,rgba --save-as tile.aseprite
2

Enable tiling both ways

Set View → Tiled Mode → Both to see the pattern repeat.
3

Draw your base elements

Add the main pattern elements. Don’t worry about edges yet—they wrap automatically!
4

Check the seams

Look for visible seams where the tile repeats. Adjust edges to make them invisible.
5

Test at different scales

Zoom out to see how the pattern looks when tiled multiple times.
Seam Issues: If you see visible lines where tiles meet, you may have hard edges or color mismatches. Use soft edges and ensure colors blend across boundaries.

​
Advanced Techniques

Create more organic patterns by offsetting your design:
  1. Draw your initial pattern
  2. Use Sprite → Canvas Size to shift the content
  3. Or use Image → Transform → Offset to reposition
  4. Fill in the new visible seams
  5. Repeat for natural-looking patterns
Shifting by half the canvas size (e.g., 16px on a 32px tile) helps break up obvious repetition.
Create complex tiles with multiple layers:
  • Base layer: Overall pattern or color
  • Detail layer: Add variety and interest
  • Shadow layer: Depth and dimension
  • Highlight layer: Light effects
Each layer tiles independently, allowing for complex compositions.
Create animated tiling patterns:
  1. Enable tiled mode
  2. Add multiple frames in the timeline
  3. Animate elements while tiling is active
  4. Export as sprite sheet or GIF
-- Script: Create animated water tile
local sprite = app.activeSprite
app.command.TiledMode { axis = "both" }

-- Add 4 frames for water animation
for i = 1, 4 do
  sprite:newFrame()
  -- Draw frame variations here
end
Great for flowing water, flickering lights, or moving clouds!
Create multiple tile variations that work together:
  1. Design a base tile with tiled mode
  2. Save it
  3. Modify it slightly for variation 2, 3, etc.
  4. Ensure all variations tile with each other
  5. Use randomly in your game for natural variation
Game engines can randomly select from your tile variations to reduce pattern repetition.

​
Real-World Examples

​
Game Background Tiles

-- Create seamless grass tile
local sprite = Sprite(32, 32, ColorMode.RGB)
app.command.TiledMode { axis = "both" }

-- Draw grass blades that wrap around edges
app.useTool {
  tool = "pencil",
  color = Color { r=34, g=139, b=34 },
  points = { Point(0, 16), Point(31, 16) }
}

​
UI Patterns

Create subtle background textures for game UIs:
  • Dotted patterns
  • Line grids
  • Noise textures
  • Geometric shapes
Keep UI patterns subtle with low contrast so text remains readable.

​
Testing Your Tiles

Quality Check Workflow
  1. View at 100% zoom to check pixel-level seams
  2. Zoom out to 25-50% to see overall pattern
  3. Create a large test sprite (e.g., 256×256)
  4. Use Edit → Fill with your tile as a pattern
  5. Look for obvious repetition or seam issues
  6. Adjust and repeat until seamless

​
Common Issues

Cause: Hard edges or discontinuous linesFix:
  • Soften edge transitions
  • Ensure elements that touch edges continue on opposite side
  • Use gradients instead of solid colors near edges
Cause: Too much symmetry or distinctive featuresFix:
  • Add more random variation
  • Use the offset technique to break up patterns
  • Create multiple tile variations
  • Avoid placing unique features in the center
Cause: Tile size doesn’t match game engine requirementsFix:
  • Check your game engine’s tile size requirements
  • Common sizes: 8×8, 16×16, 32×32, 64×64
  • Use powers of 2 for best compatibility
  • Keep aspect ratio 1:1 for standard tiles

​
Export for Games

Once your tile is perfect:
1

Disable Tiled Mode

Turn off tiled view to see only your actual tile.
2

Export as PNG

File → Export → Export As and choose PNG format.
# CLI export
aseprite --batch tile.aseprite --save-as tile.png
3

Import to Game Engine

Load your tile into Unity, Godot, GameMaker, or your engine of choice.
4

Configure Tiling

Set the tile to repeat mode in your game engine’s material or tilemap settings.

​
Keyboard Shortcuts

ActionShortcut
Toggle Tiled ModeShift + T
Cycle Tiling ModesShift + T (repeatedly)
View MenuAlt + V then T

​
Combining with Other Features

Tiled + Symmetry

Create symmetric patterns that tile perfectly in all directions.

Tiled + Animation

Animate tiling textures for water, fire, or moving backgrounds.

Tiled + Custom Brushes

Use custom brushes with tiling for detailed repeating patterns.

Tiled + Sprite Sheets

Export multiple tile variations as a sprite sheet atlas.

​
Pro Tips

Start Big, Scale Down

Create tiles at 2-4× target size, then scale down for cleaner results and easier editing.

Natural Variation

Add subtle color and detail variations to prevent obvious patterns—but keep them tileable!

Reference Real Textures

Study real-world textures (brick, grass, water) to understand how patterns naturally repeat.

Test in Context

Import your tiles into your game engine early and often to see how they look in actual gameplay.