Style combination · Pairs well

Emoji Pictographic Language × Japanese Dense Web Design

Emoji came out of Japan's phone web (J-Phone in 1997, i-mode in 1999), which commentators also credit with keeping these pages text-heavy; small pictographs set inline with text links add colour and signal to a dense list without taking space.

From the research on Japanese Dense Web Design

Mix them and make something Emoji Pictographic Language Japanese Dense Web Design

A sample layout drawn from the recipe: shapes from Emoji Pictographic Language, their arrangement from Japanese Dense Web Design, the finish from Emoji Pictographic Language. Not a real work, and not an image of either style.

What each style brings

Each part of the design comes from the style with the stronger say in it, and each style gives at least two.

Emoji Pictographic Language Japanese Dense Web Design

Type from Japanese Dense Web Design: Grotesque & neo-grotesque
Eclectic mixing
Colour from Emoji Pictographic Language: Full polychrome
Flat fields
Form from Emoji Pictographic Language: Pictogram
Stylised figuration
Composition from Japanese Dense Web Design: Column grid
Framed panels
Surface from Emoji Pictographic Language: Gloss & highlights
Flat

The type

Open fonts standing in for each style’s own type, which is often hand-drawn or commercial.

Display · Japanese Dense Web Design

Yay!

Zen Kaku Gothic New, standing in for Hiragino Kaku Gothic (Jiyukobo; the Hiragino family from 1993), the Apple system gothic, first in the stacks of mhlw.go.jp ('ヒラギノ角ゴ Pro W3') and Rakuten Travel (ProN)

Text · Emoji Pictographic Language

Pictographs typed as characters and set inline in running text. Born on Japanese mobile phones (J-Phone's 90 monochrome signs of 1997, the 176 single-colour signs that Shigetaka Kurita led for NTT DoCoMo's i-mode in 1999, on 12 x 12 pixel grids) and encoded in Unicode in 2009-2010, each emoji is one face, hand, object, food or flag centred on a square em with no ground. Unicode fixes the code point and name; each vendor draws its own full-colour version, flat, glossy or rendered in 3D, so one sign circulates in many visual dialects.

Shippori Mincho; Emoji Pictographic Language used The 12 x 12 dot external-character (gaiji) glyphs in which Japanese carriers first delivered emoji, typed into mobile mail and i-mode pages beside kana and kanji and Apple Color Emoji (2008)

The colours

The ground and leading colours come from Emoji Pictographic Language, with a counter-accent from Japanese Dense Web Design. The ink reads on the ground at 4.5:1 or more.

Emoji Pictographic Language Japanese Dense Web Design

#ffcc4d ground · 36%
#664500 ink · 14%
#f4a223 accent · 18%
#0650cb accent · 14%
#dd2e44 accent · 10%
#bf0000 accent · 8%

As CSS

:root {
  --ground: #ffcc4d;
  --ink: #664500;
  --accent-1: #f4a223;
  --accent-2: #0650cb;
  --accent-3: #dd2e44;
  --accent-4: #bf0000;
  --font-display: "Zen Kaku Gothic New", sans-serif;
  --font-text: "Shippori Mincho", serif;
}

Use it with care

Emoji Pictographic Language: Reuse emoji artwork only from the open sets and on their terms (Twemoji graphics CC BY 4.0 with attribution, OpenMoji CC BY-SA 4.0, Noto fonts SIL OFL 1.1, Fluent Emoji MIT); the platform sets are their vendors' own artwork, so do not lift their drawings into a logo or print. Remember too that a code point reaches each reader in that reader's vendor drawing, which may differ in detail, colour or even meaning from the one you chose.

Japanese Dense Web Design: Treat this as one Japanese web convention among several, not as a national essence or simply as bad design: commentators argue the density serves readers who want complete information before deciding (McGowan, 2018; Fujitsu Benelux, 2025), and many Japanese brands (MUJI, UNIQLO, POLA) choose minimal sites. Similar density appears on Korean portals such as Naver, which Fujitsu Benelux sets beside Yahoo! JAPAN, and Cruz found other regions that write in CJK characters close to Japan, so do not present it as uniquely Japanese. Dense pages still need accessibility work: offer a text-size control and a pause button for rotating banners, as mhlw.go.jp does, and give headlines lettered as images real text or alt text.