Skip to content

Brand Design

02
The Mark · 4 Directions

Geometric light,
geometric island.

Four directions, abstracting from a concrete emblem into pure geometries of light and island. Each is constructed from archetypes: circle, arc, line, and triangle.

A · Solar Commons
Evolution of the original: circular badge, radiant rays, island hill, and water waves with purer lines.
★ Primary
B · Aperture
Aperture and lens — an arc forms the horizon island, with a single point of light at the center.
Lens
C · Beacon
Minimalist beacon — a triangular peak lifting a beam of light upwards and outwards.
Minimal
D · Horizon Lume
Sunrise and reflection — a semicircle of light rising over the horizon, reflecting rhythmically on the water. Best on light backgrounds.
Reflective
03
Palette · Island & Sea

Cool depths,
luminous light.

Indigo and cyan represent the sea and island, while light gray signifies mist and paper. A touch of luminous cyan serves as the "lumina" light source, rising against the dark.

DEEP SEA
Abyss
Dark Bg / Invert
oklch(0.20 0.045 258)
CORE
Indigo
Primary / Brand
oklch(0.42 0.130 263)
SEA
Azure
Secondary / Links
oklch(0.58 0.130 245)
LIGHT
Teal Lume
Light / Accent
oklch(0.74 0.105 210)
GLOW
Glow
Highlight / Invert
oklch(0.88 0.085 200)
MIST
Mist
Divider / Card Bg
oklch(0.92 0.012 240)
PAPER
Paper
Page Bg
oklch(0.975 0.006 240)
TEXT
Ink
Body / Headings
oklch(0.26 0.04 260)
04
Typography · Geometric Sans

Precise, clear,
luminous.

Space Grotesk serves as the display typeface, its geometric skeleton bringing a clean, technological feel; Sora serves as body text, its humanist breath ensuring readability in long forms.

Display · Space Grotesk
Aa
RegularMediumSemiBoldBold
A shared commons beyond borders, shining with the light of democratic resilience.
Text · Sora
Aa
LightRegularMediumSemiBold
A luminous engine where static assets are brought to life through intelligent state machines and autonomous agents.
Display / 96Islumina
H2 / 46A commons beyond borders
Mono / 12ISL · ISLAND · SHARED · LUMINOUS
05
In Use

The mark,
at every scale.

From application icons to web heroes, social avatars, and favicons — the same geometric system remains legible at any scale.

Web Hero / Banner1600 × 700
App IconiOS · macOS
Social AvatarCircular crop
Favicon64 · 40 · 28 · 16
Clear space = ½ × mark diameter
Construction / SpaceMin size 24px