Skip to content

Brand guidelines

The AI agent floor: working AI on Hedera. Fill two boxes, get a result. The mark is our agent mascot - a rounded robot head with a spark, one fill, legible small, bold on a tab, ours alone.

Logo

on light
app icon

The mark: our agent mascot - a rounded robot head (pill eyes, a swept jaw, a four-point spark below the chin), one fill, no gradient, the eyes and face cut as holes. In chrome (header, footer, the build workspace) it’s bare - cream on the dark page, turning ember on hover. The ember plate is reserved for where the mark stands alone with no dark page behind it: favicon, home-screen icon, social preview - the bold single-colour square that reads at any size, from a browser tab up.

Loading state

The mark turns away, three dots take its place, the same turn brings it back - one continuous spin per cycle, not a reverse. The plate itself never moves; only the glyph and the dots crossfade inside it.

Download

No background - transparent

drop onto anything
Cream preview
Cream
on dark surfaces
Dark preview
Dark
on light surfaces
Ember preview
Ember
single colour

On dark

#1A1A1A plate
Cream on dark preview
Cream on dark
the default app icon
Ember on dark preview
Ember on dark
accent app icon

On light

#F5F0E8 plate
Dark on cream preview
Dark on cream
light app icon
Ember on cream preview
Ember on cream
warm on light

On ember

#D97757 plate
Cream on ember preview
Cream on ember
bold brand icon
Dark on ember preview
Dark on ember
high contrast

SVG is the source - scales to any size, no quality loss. PNG is 1024×1024. Transparent files have no background; the rest carry a rounded plate in the colour named. No wordmark export: “Amnt” is Outfit 600, set with the type below, not a fixed image.

Clearspace & minimum size

Clearspace on every side ≥ the height of the “a” in the wordmark. Never crowd the mark with text, edges, or other UI.

Icon mark minimum size: 16px. Below that, drop the wordmark entirely and use the icon alone - never shrink the full lockup past 90px wide.

Color

Primary
var(--md-sys-color-primary)
primary
Primary container
var(--md-sys-color-primary-container)
primary-container
Secondary
var(--md-sys-color-secondary)
secondary
Tertiary
var(--md-sys-color-tertiary)
tertiary
Error
var(--md-sys-color-error)
error
Surface
var(--md-sys-color-surface)
surface
Surface container
var(--md-sys-color-surface-container)
surface-container
On surface (text)
var(--md-sys-color-on-surface)
on-surface
On surface variant
var(--md-sys-color-on-surface-variant)
on-surface-variant
Outline
var(--md-sys-color-outline)
outline

One accent, used sparingly: ember (var(--md-sys-color-primary)) for actions and price. Every value above is a Tailwind token - use bg-surface-container-low, never a raw hex, so a palette change is one edit.

Typography

Run the agent
Outfit · 600–800 · headings only · font-sans
Working AI agents on Hedera: every run done in seconds, every user gets their own result.
Inter · 400–600 · body copy ·
@nova ran “Agent No. 104” · 2.40 · 2m
JetBrains Mono · prices, timestamps, on-chain data · font-mono

Settings