locale === 'ja' && ( )

What the Aztecs Can Teach Us About Design Systems

What the Aztecs Can Teach Us About Design Systems

Between the 14th and 16th centuries, the Aztec Empire administered millions of people using a standardized visual system, centuries before Google launched Material Design. The Codex Mendoza is the best proof it ever existed. Here's what it can teach modern web designers.

The Aztec Empire's Design System That Governed Millions

In October 2025, the W3C's Design Tokens Community Group announced the first stable version of their Design Tokens Specification. For the readers that have a life, this is a formal standard for defining the reusable visual atoms (colors, spacing, typography, sizing) that power a lot of our modern digital interfaces. The announcement was treated as a major milestone. The industry finally had a shared language for the tiny, standardized building blocks that keep products visually consistent across platforms, teams, and time zones.

The Aztec Empire solved the same problem roughly five hundred years earlier.

Between the 14th and 16th centuries, the Aztec state administered an empire of 5 to 6 million people across modern-day central Mexico. It collected tribute from 38 provinces and hundreds of city-states. It waged wars, built temples, ran markets, settled legal disputes, tracked property lines, managed a complex ritual calendar, and documented all of it without an alphabet. Instead, the Aztecs built a visual information system, which was comprised of a standardized set of glyphs, numeral symbols, color conventions, page templates, and compositional rules that allowed trained specialists to encode, transmit, and decode complex data across vast distances and generations. It was a design system in every structural sense of the term. And the reason we know how it worked is that one document survived.

The Codex Mendoza is a 71-folio manuscript painted by indigenous artist-scribes in Mexico City around 1541, and is the most complete artifact of the Aztec visual tradition that still exists. Now to be specific, this is not the design system itself, but it's the proof that one (very, very complex one) existed. And when you examine it through the lens of contemporary design architecture, the parallels are facinating and they show that many "emerging" modern design templates we take for granted today are merely reiterations of prior inventions.

Codex Mendoza

What We Mean by "Design System"

Before drawing the comparison, we need to strip "design system" down to its structural function.

At it's core, a design system is a set of constraints and components that allow multiple people to produce visually and functionally consistent output without direct supervision. Today, SaaS tools like Figma have popularized the phrase, but these are just implementations of the concept. The concept of a design system itself is much older. Across human artistic history, there have beem hundreds (if not thousands) of shared vocabulary of visual rules that have enabled distributed groups of creators build things that look and feel like they belong together.

Today, Google's Material Design does this for Android apps, while IBM's Carbon does it for enterprise software. Salesforce's Lightning does it for CRM interfaces and the new Design Tokens Specification now provides a formal standard for exchanging the atomic values between these systems. According to Zeroheight's Design Systems Report 2025, 84% of teams have adopted design tokens.

All these systems and frameworks are attempts of answering the ancient problem: how do you enable distributed creators to produce consistent, complex visual output at scale? The Greeks formalized proportional systems that governed architecture from Athens to Alexandria. Medieval scriptoria developed standardized page layouts. And the Aztec Empire, governing millions across a territory with no centralized printing technology, no shared alphabet, and dozens of distinct ethnic groups, built a visual system so robust that it survived the destruction of the civilization that created it.

The Aztec Visual Tradition: A System, Not a Document

Like any design system, the Aztec visual information system wasn't invented by any one person or created for any single purpose. It was a living tradition, refined over the course of roughly two centuries, that permeated every level of Aztec governance, commerce, religion, and education. To understand why it qualifies as a design system, you need to understand what it actually consisted of.

The Practitioners: Tlacuiloque

The people who operated the system were the tlacuiloque (singular: tlacuilo), which translates roughly to "painter-writers" or "painter-scribes." The Nahuatl language didn't distinguish between painting and writing, as the two were the same act. The phrase in tlilli in tlapalli, meaning "the black ink, the red paint," was a metaphor for knowledge and wisdom itself.

Tlacuiloque could be men or women. They trained from childhood at calmecacs, elite schools reserved primarily for nobility, though exceptionally talented commoner children were sometimes admitted. The profession was often hereditary, passed from parent to child across generations. Their education encompassed not just technical painting skills but the entire cosmological and cultural framework behind the visual language: the mythology, the ritual calendar, the tributary system, the phonetic and pictographic conventions that made the whole system work.

The best tlacuiloque were called toltecatl; an honorific linking them to the legendary Toltec master artisans. They were said to possess yolteotl, "god in their heart," because encoding knowledge into visual form was understood as a sacred act. And crucially, tlacuiloque didn't sign their work. The system belonged to the society, not to any individual creator; which maps precisely onto the design-system philosophy where the system produces consistent output regardless of who's using it.

tlacuilo.webp

The Components: A Visual Vocabulary

The tlacuiloque worked with a standardized set of reusable visual components, each carrying specific, consistent meaning across every document in which it appeared.

Place-glyphs (toponyms). Every town, city, and settlement in the Aztec world had a unique visual identifier, which was a glyph that encoded its Nahuatl name through a combination of pictographic and phonetic elements. The glyph for Cuauhnahuac ("near the trees") combined a tree image with a speech scroll, using the sound of "speak" as a phonetic stand-in for "near", while the glyph for Tochtepec ("rabbit hill") showed a rabbit atop a hill. These were standardized components and acted as self-contained, portable, and semantically encoded atoms. A tlacuilo painting a tribute record didn't invent a new glyph each time; they pulled from the shared vocabulary that every trained practitioner could read.

The Codex Mendoza alone contains 612 distinct place-glyphs, making it a component library larger than many modern icon sets.

Numeral tokens. The Aztec number system was vigesimal (base-20). Rather than positional notation, it used a cascading set of four standardized symbols:

  • A dot (kernel of corn) = 1
  • A flag = 20 (cempoalli, meaning "one count")
  • A feather (or fir tree) = 400 (20 × 20; tzontli, meaning "hair" as numerous as hairs on one's head)
  • An incense bag = 8,000 (20 × 400; xiquipilli, referencing the uncountable beans in a full cacao sack)

These symbols were composable. Five flags and three dots meant 103. Two feathers and ten flags meant 1,000. The tokens combined freely with any pictorial element. One could attach numeral glyphs to a drawing of cotton mantles, warrior costumes, or cacao beans, and you had a precise quantitative record. The same four symbols could express any quantity the empire needed to track.

In modern terms, these are design tokens: portable, atomic units of meaning that combine with other components to express different data in different contexts.

Aztec Mathematic System

Page templates. Documents built using the Aztec visual system followed consistent structural layouts. Tribute records, for instance, used a standard format: the head town's glyph in the upper-left corner, subordinate town glyphs running along the left and bottom margins, tribute goods depicted in the center, and numeral tokens indicating quantities. This was a convention that appeared identically across multiple documents such as the Matrícula de Tributos, the Codex Mendoza, and related records; all created by different hands at different times, sometimes decades apart.

Semantic color. Aztec color wasn't just for decoration, it served as way to demonstrate information. Each cardinal direction was associated with specific colors and ruling deities: east with red (Huitzilopochtli, war and the sun), south with blue (Tlaloc, rain and fertility), west and north with black (death, the underworld). The pigments themselves carried material and culutral meaning. The Nahuatl word tlapalli (their term for color) literally means "something dyed" and specifically referred to cochineal-sourced red. Cochineal, derived from scale insects cultivated on cacti in Oaxaca, produced reds so vivid that after the conquest it was traded at ten times the value of gold by weight. Indigo plants produced the blues. Charcoal and minerals produced the blacks.

In a modern design system, you don't define a button color as #FF0000 across every instance, you define it as color.danger or color.action.primary, and the meaning travels with the token as you refer to it across the codebase. The Aztec system worked identically. Red didn't just mean "red." It meant blood, sacrifice, east, the sun, war, life force. The color was the meaning. The pigment was the token.

The Scale

This visual system wasn't a niche practice used by a handful of scribes. It operated at the scale of an empire. The Aztec state maintained libraries of painted manuscripts, including tax records, land surveys, legal documents, ritual calendars, genealogies, market accounts. Bernal Díaz del Castillo, who accompanied Cortés, reported that Moctezuma II's palace contained a library full of such books, kept by a specialized official. Merchants used the system for trade records. Temples used it for ritual documentation. Courts used it for legal proceedings.

The calmecacs trained new tlacuiloque in every generation, ensuring continuity. The visual conventions were stable enough that documents produced decades apart, by different artists in different cities, remain legible to scholars today because they follow the same rules.

The Codex Mendoza: The Artifact That Survived

So why do we talk about the Codex Mendoza specifically? Because the Spanish burned almost everything else.

After the conquest of Tenochtitlan in 1521, Spanish priests destroyed indigenous manuscripts on a massive scale, believing them to be works of the devil. Very few pre-conquest Aztec codices survive. The roughly 500 colonial-era manuscripts we have access to today were mostly created after the conquest, often commissioned by Spanish administrators who needed to understand the systems they'd conquered.

The Codex Mendoza was one of these post-conquest documents. Commissioned around 1541 by Antonio de Mendoza, the first viceroy of New Spain, it was intended for King Charles V of Spain as evidence of the Aztec political and tribute system. The primary artist is identified in a contemporary account as Francisco Gualpuyogualcal, "the master of painters". They were an indigenous tlacuilo working at the Franciscan college in Tlatelolco. He may have also worked on the earlier Matrícula de Tributos, making him something like a senior design lead maintaining multiple versions of the same system.

The manuscript has a wild provenance too. Shipped from Mexico City toward Spain, it was captured by French privateers before reaching Charles V, where it ended up with André Thévet, cosmographer to King Henry II of France, who scrawled his name across it five times. Then it passed through English hands (Richard Hakluyt, Samuel Purchas, John Selden), before landing at Oxford's Bodleian Library in 1659, where it sat in near-obscurity until 1831.

The codex consists of 71 folios across three sections:

Section I documents the history of the Aztec Empire from the founding of Tenochtitlan in 1325 through the conquest by using standardized year-glyphs, ruler portraits, and conquest symbols (place-glyphs pierced by flaming spears).

Section II is the tribute section, spanning 38 pages; which catalogs the tax obligations of every province in the empire. Each page follows the identical template described above: head town glyph, subordinate towns along the margins, tribute goods in the center, numeral tokens indicating quantities. Provinces near the capital contributed staple goods (cotton mantles, maize, beans). Peripheral provinces sent high-value items (quetzal feathers, jade, gold dust, cacao, jaguar skins).

Section III depicts daily Aztec life from birth to death (including child-rearing, education, military training, marriage, etc.) using the same visual conventions as the other sections.

What makes the Codex Mendoza irreplaceable isn't that it is the design system. It's that it's the most complete demonstration of the system in action. The 612 place-glyphs, the numeral tokens, the semantic colors, the rigid templates, they're all here, deployed across 71 folios of real administrative content. And because the document also includes Spanish-language glosses and commentary, it functions as a kind of Rosetta Stone for the Aztec visual tradition, letting modern scholars decode conventions that might otherwise be unreadable.

The Codex Mendoza isn't the design system. It's the documentation.

What the Aztec System Got Right

Noting the parallels is interesting. But identifying where the Aztec approach actually outperforms modern counterparts is more useful.

Self-Documenting Components

A single Aztec place-glyph carries its meaning in its form. The rabbit-on-a-hill for Tochtepec, the tree-with-speech-scroll for Cuauhnahuac; you don't need external documentation to understand what the glyph represents if you know the visual language. The same is true of the numeral tokens: the flag for 20, the feather for 400, and the incense bag for 8,000 all visually evoke their meaning (counting, abundance, uncountable quantity).

Compare this to modern design tokens, where spacing.md = 16px is clear and functional, but it's semantically empty. You need to read the documentation to know what spacing.md means. The Aztec tokens are self-documenting by design.

Semantic Density

A single tribute page from the Codex Mendoza packs province identity, constituent towns, specific goods, precise quantities, and payment frequency into a space smaller than a sheet of notebook paper, all without a single word of alphabetic text. The pictorial system achieves a density of encoded information that modern component documentation, which relies heavily on text labels, rarely matches.

Governance Without Version Control

The Aztec visual system maintained consistency across an empire of millions without Figma, without Git, without Slack, without design ops teams. It achieved this through institutional training (calmecacs), hereditary knowledge transfer, and a cultural framework that treated visual consistency as sacred duty rather than a workplace productivity metric.

Modern design systems struggle with adoption. Zeroheight's 2025 report emphasizes that success depends on "explaining the value of the design system to business leaders and educating colleagues." The tlacuiloque never had an adoption problem. Their system's value was self-evident because it was woven into the culture's most fundamental structures: religion, taxation, warfare, commerce. Nobody needed a lunch-and-learn to understand why the visual conventions mattered.

Survival

Perhaps the most striking feature: the Aztec visual system survived the total destruction of the civilization that created it. The Spanish conquered the empire, burned the libraries, dismantled the temples, and forcibly converted the population. The tlacuilo tradition should have died with Tenochtitlan.

But it didn't. Indigenous painter-scribes continued producing manuscripts in the pre-Hispanic style for decades after the conquest, adapting their conventions to European paper and colonial administrative purposes. The visual vocabulary was so deeply embedded in the culture's knowledge infrastructure that it persisted even when every institutional support for it had been destroyed.

That's a design system stress test that no modern framework has ever faced.

What This Means for Your Website

As much as it may sound appealing now, you don't need an Aztec-grade visual system for a small business website. You're not governing 38 provinces (that I'm aware of). But the principles embedded in the tlacuilo tradition apply at every scale:

Consistency is a system, not a preference. The tlacuiloque didn't produce consistent pages because they had similar taste. They produced consistent pages because they trained in the same schools, used the same visual vocabulary, and followed the same structural templates. If your website has inconsistent button styles, mismatched type scales, or colors that drift from page to page, the problem isn't aesthetic: it's architectural. You don't have a system and users will notice these discrenpencies.

Components should carry meaning. An Aztec place-glyph encodes a specific town's name through visual and phonetic elements. Your components should work the same way. A call-to-action button shouldn't just "look important." Its color, size, placement, and label should all communicate a consistent message about what happens when the user clicks it.

Color is never just color. In the Aztec system, every hue carried cosmological, directional, and social meaning. On your website, color should communicate hierarchy, state, brand identity, and emotional tone through deliberate, consistent application. Semantic color systems are a 21st-century specification for a principle the Aztecs practiced in the 14th century.

The system should outlast its creators. The Aztec visual tradition survived the fall of an empire, the burning of its libraries, colonial occupation, capture by pirates, and nearly four centuries of obscurity in an English university. Your design system should be built to survive for a couple years too (although centuries may be pushing it).

Conclusion: The Black and the Red

In tlilli in tlapalli. The black ink. The red paint. The Nahuatl phrase for the totality of visual knowledge.

Modern design systems are still pursuing what that phrase describes: a unified framework where structure and meaning are inseparable, where every visual element serves both functional and semantic purposes, where the system itself encodes knowledge that's legible to anyone trained in its conventions.

The Aztec tlacuiloque achieved this. They built a visual information system that governed an empire of millions, scaled across hundreds of provinces, survived the destruction of the civilization that created it, and remains legible to scholars five centuries later. The Codex Mendoza sits in the Bodleian Library as the most complete proof that this system existed and worked.

The W3C's Design Tokens Specification is just seven months old.

We're not the first people to solve these problems. We're the latest. And the tlacuiloque, painting their standardized glyphs with cochineal and indigo in a colonial workshop in Mexico City in 1541, understood something that every modern design system is still learning: the system is the knowledge. Build it well enough, and it carries meaning across time, across languages, across the fall of civilizations.

Not bad for a tax document.

Interested in building a web presence with the structural integrity of a 16th-century visual tradition? Launch Turtle helps businesses create websites where every component, color, and layout decision serves a purpose. Get in touch to start the conversation.

Works Cited

Weekly Insights

Get actionable web development tips that actually work. No fluff, just proven strategies.

Join 5,000+ developers and business owners worldwide

Weekly insights • No spam • Unsubscribe anytime

Share Article

Jackson White

Jackson White

Content Creator

Jackson is the founder and lead developer at Launch Turtle, bringing over 4 years of technical expertise to help small and mid-sized businesses establish powerful online presences. Let's Launch!

あなたの 夢のプロジェクトを始めませんか?

成功について読むのをやめて、創造を始めましょう。 無料のウェブサイト診断 を受けて、私たちがどのようにビジネスの成長をサポートできるかを発見してください。

Launch Turtleと共に成長している企業に加わりましょう。 スパムなし、プレッシャーなし—結果だけ。