# Isometric Pixel Art

> Pictures built by hand from single pixels in a 2:1 dimetric 'isometric' projection, made as posters, prints, covers and web graphics rather than as game screens. Its signature is eBoy's Pixorama: a dense, toy-like city of modular buildings, cars, billboards, brand logos and tiny figures packed edge to edge in flat, saturated colour. Habbo Hotel's furnished pixel rooms, though a game world themselves, set off a wide amateur practice of isometric pixel rooms and dioramas made as pictures.

- Period: 1998–present
- Where: Central Europe, Northern Europe, Global / networked
- Origin: Berlin: the pixel studio eBoy (Kai Vermehr, Steffen Sauerteig, Svend Smital; founded 1997 (Dezeen gives 1998), with Peter Stemmler in New York by 2001), whose isometric Pixoramas began in 1998; spread through the Finnish virtual world Habbo Hotel (Sulake; launched as Hotelli Kultakala, August 2000) and pixel-art web communities. The projection comes from games such as Zaxxon (1981), Knight Lore (1984) and SimCity 2000 (1994)
- Branch: Digital native
- Also known as: Iso pixel art, Pixel isometric, Pixoramas (eBoy's name for its city panoramas), Pixel cityscapes, 2:1 dimetric pixel art
- Page: https://stylogeny.com/styles/isometric-pixel-art/

## How it works

- Draw every receding line on the 2:1 pixel step (about 26.6 degrees), so the whole picture sits on one tilted grid with no vanishing point.
- Place each pixel by hand in flat, saturated colour, with hard outlines and one lit and one shaded tone per face instead of gradients.
- Pack the field edge to edge with buildings, vehicles, signs and tiny figures, so the eye wanders with no single focal point.
- Assemble scenes from a reusable library of drawn modules (eBoy's holds more than 5,000) and recombine them like a construction kit.
- Stock the city with brand logos, ads and pop-culture props, and treat consumer culture as a toy town with an ironic wink.
- Or isolate one furnished room, building or diorama on a plain ground, cut out along its 2:1 edges like a model on a tabletop.

## Its design choices

Defining choices make the style, characteristic ones are usual, occasional ones turn up now and then.

### Layout & composition
- [All-over field](https://stylogeny.com/design-choices/all-over-field/) (defining)
- [Full bleed](https://stylogeny.com/design-choices/full-bleed/) (characteristic)
- [Diagonal axis](https://stylogeny.com/design-choices/diagonal-axis/) (characteristic)
- [Isolated object](https://stylogeny.com/design-choices/isolated-object/) (characteristic)
- [Modular grid](https://stylogeny.com/design-choices/modular-grid/) (occasional)

### Space & hierarchy
- [Horror vacui](https://stylogeny.com/design-choices/horror-vacui/) (defining)
- [Illusion of depth](https://stylogeny.com/design-choices/illusion-of-depth/) (defining)
- [Repetition & rhythm](https://stylogeny.com/design-choices/repetition-and-rhythm/) (characteristic)
- [Flat hierarchy](https://stylogeny.com/design-choices/flat-hierarchy/) (characteristic)
- [Layered information](https://stylogeny.com/design-choices/layered-information/) (occasional)

### Typography
- [Bitmap & pixel](https://stylogeny.com/design-choices/bitmap-and-pixel/) (defining)
- [Ornamented display](https://stylogeny.com/design-choices/ornamented-display/) (occasional)
- [Eclectic mixing](https://stylogeny.com/design-choices/eclectic-mixing/) (occasional)
- [All caps](https://stylogeny.com/design-choices/all-caps/) (occasional)

### Colour
- [Full polychrome](https://stylogeny.com/design-choices/full-polychrome/) (defining)
- [Flat fields](https://stylogeny.com/design-choices/flat-fields/) (defining)
- [Complementary clash](https://stylogeny.com/design-choices/complementary-clash/) (occasional)
- [Light ground](https://stylogeny.com/design-choices/light-ground/) (occasional)

### Form & shape
- [Rectilinear](https://stylogeny.com/design-choices/rectilinear/) (defining)
- [Stylised figuration](https://stylogeny.com/design-choices/stylised-figuration/) (characteristic)
- [Geometric primitives](https://stylogeny.com/design-choices/geometric-primitives/) (occasional)
- [Pictogram](https://stylogeny.com/design-choices/pictogram/) (occasional)

### Surface & texture
- [Flat](https://stylogeny.com/design-choices/flat/) (defining)
- [Hard offset shadow](https://stylogeny.com/design-choices/hard-offset-shadow/) (occasional)

### Ornament
- [Abundant decoration](https://stylogeny.com/design-choices/abundant-decoration/) (characteristic)
- [Emblems & badges](https://stylogeny.com/design-choices/emblems-and-badges/) (occasional)

### Imagery
- [Comic & cartoon](https://stylogeny.com/design-choices/comic-and-cartoon/) (characteristic)
- [Found & vernacular imagery](https://stylogeny.com/design-choices/found-and-vernacular-imagery/) (characteristic)
- [Icons & pictograms](https://stylogeny.com/design-choices/icons-and-pictograms/) (occasional)
- [Pattern & repeat](https://stylogeny.com/design-choices/pattern-and-repeat/) (occasional)

### Medium & production
- [Web & CSS](https://stylogeny.com/design-choices/web-and-css/) (defining)
- [Offset printing](https://stylogeny.com/design-choices/offset-printing/) (characteristic)
- [Motion & broadcast](https://stylogeny.com/design-choices/motion-and-broadcast/) (occasional)

### Tone & intent
- [Playful & witty](https://stylogeny.com/design-choices/playful-and-witty/) (defining)
- [Ironic & self-aware](https://stylogeny.com/design-choices/ironic-and-self-aware/) (characteristic)
- [Technological & futurist](https://stylogeny.com/design-choices/technological-and-futurist/) (characteristic)
- [Communal & popular](https://stylogeny.com/design-choices/communal-and-popular/) (characteristic)
- [Nostalgic & retro](https://stylogeny.com/design-choices/nostalgic-and-retro/) (occasional)

Avoids: Gradients, Gloss & highlights, Chrome & 3D render, Painterly brushwork, Generous white space, Straight photography, 3D render, Biomorphic curves, Whiplash line, Script

Palette: #f2f2ee, #26263a, #e8413c, #ffc933, #3d8fe0, #4dbb5a

Typefaces: Hand-pixelled lettering drawn into the scene: shop signs, billboards and brand logos sheared onto the 2:1 planes of the buildings, as in eBoy's Pixoramas, Small bitmap fonts for captions and navigation beside the picture, such as Silkscreen (Jason Kottke), a typeface for web graphics where extremely small display type is needed (a working recommendation: the style has no settled typeface)

Known for: eBoy, Pixoramas: detailed isometric city panoramas, more than 20 since 1998, among them Berlin, London, Los Angeles, New York, Paris, Rio, San Francisco and Tokyo; eBoy, eCity London for Paul Smith, used as a fabric print on bags, T-shirts and shoe linings (2004); eBoy, monthly cover for the online magazine SHIFT (February 2001); eBoy, Hello (Laurence King, 2002) and Pixorama (eBoy, 2008), books; eBoy in Game Over, Museum für Gestaltung Zürich (1999), and Drones of New York, Museum of the Moving Image, New York (2013); Habbo Hotel (Sulake; launched as Hotelli Kultakala, August 2000), whose rooms and furniture inspired a great amount of fan-made isometric pixel art (Wikipedia, Pixel art); Precedents in games: Zaxxon (1981), Knight Lore (ZX Spectrum, 1984) and SimCity 2000 (1994)

## Where it comes from, and what it’s close to

- Grew out of: [Bitmap & Pixel Graphics](https://stylogeny.com/styles/bitmap-pixel.md) (1977–1995)
- Influenced by: [Pop Art Graphics](https://stylogeny.com/styles/pop-art.md) (1955–1975)
- Influenced by: [Early Web Vernacular](https://stylogeny.com/styles/early-web.md) (1994–2004)
- Alike in its design choices: [Cyworld Minihompy & Minimi (Korean Mini-Homepage Culture)](https://stylogeny.com/styles/cyworld-minihompy.md) (2001–2015), 58% alike
- Alike in its design choices: [NFT Profile-Picture Collections (CryptoPunks to Bored Apes)](https://stylogeny.com/styles/nft-pfp-collections.md) (2017–present), 56% alike
- Alike in its design choices: [Yami-Kawaii (Sick-Cute)](https://stylogeny.com/styles/yami-kawaii.md) (2013–present), 55% alike
- Alike in its design choices: [Hong Kong Protest Art (Umbrella Movement to the 2019–20 Protests)](https://stylogeny.com/styles/hong-kong-protest-art.md) (2014–2020), 54% alike
- Alike in its design choices: [Indian Pop-Kitsch Design (Desi Kitsch)](https://stylogeny.com/styles/indian-kitsch.md) (1997–present), 54% alike
- Alike in its design choices: [Danmaku Bullet-Comment Overlay](https://stylogeny.com/styles/danmaku-comments.md) (2006–present), 49% alike

## Sources

- Wikipedia, eBoy, en.wikipedia.org/wiki/EBoy
- Dezeen, eCity by eBoy (20 March 2007; an excerpt from Marcus Fairs, Twenty-First Century Design, Carlton Books), dezeen.com/2007/03/20/ecity-by-eboy/
- SHIFT (online magazine), eBoy (February 2001), shift.jp.org/en/archives/2001/02/eboy.html
- Wikipedia, Habbo, en.wikipedia.org/wiki/Habbo
- Wikipedia, Pixel art, en.wikipedia.org/wiki/Pixel_art
- Wikipedia, Isometric video game graphics, en.wikipedia.org/wiki/Isometric_video_game_graphics
- Jason Kottke, Silkscreen, kottke.org/plus/type/silkscreen/

---

From Stylogeny (https://stylogeny.com/), an atlas of graphic-design styles by Van Riel Online Services. How it is made: https://stylogeny.com/about/. Cite as: Stylogeny, “Isometric Pixel Art”, https://stylogeny.com/styles/isometric-pixel-art/