P / 01
Signal membranes
Fine layers gather around a source signal without hiding the connections.
Download vectorCodLab / VISUAL SYSTEMSOFTWARE / HUMAN CONTEXT
FORM / STRUCTURE / HUMAN MEANING
The code of life.
A system in motion.
A shared visual language for software and the people around it. Fine structure, open space and explicit boundaries connect every part of CodLab.
Original coded forms. Monochrome light, fine structure and human control.
A CONNECTED WORKFLOWSOURCE / EVIDENCE / DECISION
A conceptual map of the review workflow.
01 / PATTERN LIBRARY
Six forms.
One visual language.
Fine filaments, spatial particles and visible limits. These original coded forms support product stories, documentation and brand materials.
P / 02
Molecular lattice
An abstract double lattice gives structure to connected software context.
Download vector
P / 03
Orbital membrane
An open spatial membrane keeps both its structure and its limits visible.
Download vector
P / 04
Structural cells
Distinct connected cells express the rhythm of an explicit human decision.
Download vector
P / 05
Layered membranes
Fine folds reveal layers of evidence and a traceable source connection.
Download vector
P / 06
Particle stream
Scattered particles resolve into an ordered path through dark space.
Download vectorThese are conceptual brand patterns. Decorative connections do not represent repository activity or review results.
IDENTITY / CODE OF LIFE
One shared world.
Connected by code.
The globe connects our work across teams and tools. Balanced geometry and equal clear space keep it readable beside software, people and decisions.
Download the dark mark →
Code is human.
Make it clear.
IBM Plex Mono / precise supporting detail
Ä Ö Ü ä ö ü ß · 0123456789
Self-hosted, open-license typography. Monochrome artwork. Color communicates an action or a defined software state.
02 / MARK & SYMBOLS
Built around
connection.
The CodLab globe represents connection. Simple line symbols carry the same clarity into navigation, evidence, and actions.
CodLab
The globe mark
Warm white / CodLab red
Pair a symbol with a clear text label. Download the symbol collection →
03 / FOUNDATIONS
Calm surfaces.
A clear signal.
Monochrome artwork pairs with readable software states. Color stays purposeful: an action, a confirmed pass, or a question for review.
TYPE / SPACE GROTESK
AaUnderstand
the change.
Readable sentences. Confident headings. Enough space to inspect the evidence.
IBM PLEX MONO / CODE & METADATA
src/render.js · reviewed commitCOLOR / CORE PALETTE
- Graphite
- #080b0f
- Raised surface
- #111820
- Warm white
- #f3f6f8
- Secondary text
- #b3bec9
- Action red
- #c7233e
- Signal red
- #ff5267
- Pass / healthy
- #6fd3a5
- Review / caution
- #dfb060
SPACE / A MEASURED RHYTHM
Room for the important details.
4
8
12
16
24
32
48
64
12px
surface radius
surface radius
Foundations come from the shared CodLab styles. Patterns and components extend those same colors, type stacks, and surfaces.
04 / INTERFACE LANGUAGE
Make the state
easy to read.
Consistent surfaces, labeled evidence, and explicit unknowns keep the interface useful. Every value below belongs to an illustrative sample.
ILLUSTRATIVE SAMPLENeeds review
Inspect the changed source.
Example pull request / three changed files
src/render.js
element.innerHTML = input;An HTML sink appears in the changed source. Whether the input is attacker-controlled is unknown.
- Source pattern
- Observed
- Input exposure
- Unknown
- CI evidence
- Not provided
STATE / TEXT FIRST
Different meanings. Clear labels.
Pass
The stated check passed.
Review
A person needs to inspect the evidence.
None
No findings within the reviewed scope.
Unknown
The evidence is unavailable or unresolved.
ACTION / A VISIBLE BOUNDARY
Your approval
before publication.
Pair the next step with the evidence a person needs to make that decision.
Explore the fix workflow →05 / MOTION SIGNATURE
A living field.
A stable center.
The orbit brings the same points, paths, and brackets into motion. Select a layer to explore the story, or pause the composition to inspect it.
Motion responds to your pointer and stays quiet when you prefer reduced motion. The artwork is an illustrative concept.
See it in the CodLab experience →
CHANGED SOURCEBOUNDED CONTEXTA conceptual map of the review workflow.
A finding begins at the changed line. Inspect the source, the reviewed commit, and the limits of the available evidence.
ONE SYSTEM / EVERY TOUCHPOINT