Roman Mosaic

Tesserae of the Ancient Villa

A design system inspired by the tessellated stone floors of Pompeii, Herculaneum, and the grand villas of the Roman Empire.

I

Color Palette

Drawn from the natural pigments and stones of the Roman world: terracotta tiles, Carrara marble, volcanic ash, and imported lapis.

Terracotta

#C2703E

Primary accent

Marble White

#F2EDE4

Background

Roman Red

#8B2A2A

Emphasis, danger

Imperial Blue

#2C4A6E

Information, links

Olive Green

#5C6B3C

Success, nature

Aged Stone

#8C8376

Neutral, grout

Ochre

#C9A84C

Warning, gold

Charcoal

#3A3530

Text, anchoring

II

Typography

Classical serifs evoking carved Roman inscriptions, paired with elegant body text for extended reading.

Display Cinzel Decorative / 400 / clamp(3-5.5rem)

SPQR

Heading 1 Cinzel / 800 / clamp(2-3rem)

Ave Imperator

Heading 2 Cinzel / 600 / clamp(1.5-2rem)

Villa dei Misteri

Heading 3 Cinzel / 500 / 1.25rem

Opus Tessellatum et Opus Vermiculatum

Body Cormorant / 400 / 1.2rem / 1.85 line-height

Roman mosaics were among the most enduring achievements of classical antiquity. Composed of thousands of small stone, glass, and ceramic pieces called tesserae, these floor and wall decorations adorned everything from modest townhouses to grand imperial palaces. The craftsmen who laid them, known as tessellarii, developed techniques of extraordinary precision that would not be equalled for centuries after the fall of Rome.

Caption Cormorant Italic / 400 / 0.9rem

Detail of the Alexander Mosaic from the House of the Faun, Pompeii, c. 100 BCE. Naples National Archaeological Museum.

Inscription Cinzel / 700 / 1.5rem / 0.35em tracking

CAVE CANEM

III

Spacing Scale

A proportional scale based on the modular dimensions of Roman tile-work, from the smallest tessera to the grandest atrium.

XS
4px
SM
8px
MD
16px
LG
24px
XL
32px
2XL
48px
3XL
64px
4XL
96px
IV

Buttons

Solid, functional controls echoing the directness of Roman engineering. Hover reveals a tessellated texture beneath.

Primary & Secondary

Color Variants

Sizes

V

Form Elements

Input fields framed in the stone and grout palette of the ancient workshop. Each element is a tessera in the larger composition.

VI

Cards & Panels

Content containers laid like tiles in a floor -- separated by grout lines, each holding its own scene.

Opus Tessellatum

The most common technique, using standardized cubic tesserae of roughly equal size to create geometric patterns and decorative borders on villa floors.

Opus Vermiculatum

An intricate technique using very small, irregularly shaped tesserae to render fine pictorial detail, named for its worm-like curving lines of tiles.

Opus Sectile

Precisely cut pieces of marble and colored stone fitted together to form figurative and geometric compositions, favored in the most luxurious Roman interiors.

The Alexander Mosaic

Perhaps the most famous Roman mosaic ever discovered, this monumental floor piece from the House of the Faun in Pompeii depicts the Battle of Issus between Alexander the Great and Darius III of Persia. Composed of an estimated 1.5 million tesserae in opus vermiculatum technique, it demonstrates the pinnacle of Roman mosaic artistry.

VII

Alerts & Notifications

Messages bordered like inscription tablets, each color drawn from the natural palette of stone, earth, and imported pigment.

i

Nota Bene

The tessellarii will arrive at dawn to begin laying the atrium floor. Ensure the mortar bed has been prepared according to Vitruvius, Book VII specifications.

V

Opus Completum

The triclinium mosaic has been completed successfully. All 24,000 tesserae have been set and the grout has fully cured. The floor is ready for use.

!

Caveat

The shipment of blue glass tesserae from Egypt has been delayed. Consider substituting local limestone for the border pattern until supplies arrive.

X

Periculum

Subsidence detected beneath the caldarium floor. The mosaic must be lifted and the substrate repaired before the tiles crack further. Cease all foot traffic immediately.

VIII

Design Principles

Guiding philosophies drawn from two millennia of enduring craftsmanship.

Tessellated Structure

Every element is a tessera in a larger composition. Grout-gap borders separate components the way mortar lines separate tiles, creating visual rhythm through repetition and interval.

Earthy Materiality

Colors should feel as though they were ground from natural stone and mineral pigments. Avoid digital-feeling neons or gradients. Every hue should feel like it could be held in the hand.

Classical Proportion

Follow the Roman sense of order and symmetry. Typography draws from carved inscriptions. Spacing follows a modular scale. Balance and alignment are paramount.

Aged Patina

Surfaces should suggest centuries of wear. Slightly muted colors, subtle texture overlays, and warm undertones give the impression of sunlit stone that has weathered gracefully.

Functional Beauty

Roman engineering married utility with aesthetics. Every decorative element should serve a functional purpose. Borders delineate, patterns guide the eye, and motifs communicate hierarchy.

Enduring Craft

Like the mosaics that survive two thousand years after their creation, build with care and intention. Semantic markup, clean CSS variables, and responsive foundations ensure longevity.