Hilo

Hilo is a proactive AI agent that lives in your channels — WhatsApp above all. Connect it to your tools and it manages them for you, including complex ones like WhatsApp groups. Everything you delegate becomes a thread — Hilo picks it up, remembers the context, acts, and comes back only when there’s something to decide.

Pick up the thread.

Logo · light

Logo · dark

Monochrome — single-color contexts only

Use the two-color lockups whenever possible. Monochrome is for engraving, embossing, single-color print, and strict co-brand bars.

Scale

Mark & app icon

Animated reveal

The thread draws itself once along its natural construction direction — starting at the top-right loop, through the stems, crossbars, and every loop — with ease-in-out timing (2 s at 60 fps), then settles and holds on the finished lockup. Two color treatments, both strictly on-palette: the thread-gradient reveal — Hilo Purple → Blue → Teal at 135°, the brand’s own gradient, for hero moments where the thread literally appears — and the Hilo Purple reveal for email signatures, docs, and anywhere the accent should stay quiet. The master is Lottie (logo/hilo-mark-reveal.json, transparent background, geometry identical to the SVG mark) for web and apps; the GIFs (hilo-mark-reveal.gif, hilo-icon-animated.gif) are the email-safe derivatives and open on the finished mark so clients that freeze GIFs never show a blank. Play it once per surface — the reveal is an entrance, not a loader.

Social profiles — the avatar

One image for every profile and avatar — WhatsApp, X, Instagram, LinkedIn, Slack, TikTok, app stores. The white mark on the full-bleed Hilo Purple gradient, sized so the knot survives whatever crop the platform applies — rounded square or circle — always centered, never clipped.

HDR icon — brighter than white

An ordinary 8-bit PNG carrying a Rec. 2020 + PQ ICC profile — the encoding of HDR video. On Apple’s EDR displays (MacBook Pro XDR, recent iPhones) the browser honors the profile and renders the icon brighter than white; on SDR screens it tone-maps down and just looks normal. A progressive-enhancement glow for hero moments — never a replacement for the standard avatar.

See it glow — the HDR page →

Spacing — the loop is the unit

Minimum sizes

Construction

Color

Primary gradient

Hilo Purple → Hilo Blue, 90°. Hero backgrounds and thread illustrations only — never on the logo itself. Blue and Teal are supporting colors: they may accompany the brand in product UI and charts, but the mark and i-dot are always Hilo Purple (or mono Ink/White).

Typography

Iconography

Product icons follow the mark’s drawing logic: single stroke weight (2.3 on a 30-unit grid ≈ 1.5 px at 20 px), rounded caps and joins, elliptical rather than perfectly round counters, friendly and modern. Draw icons as strokes, never filled shapes, so they sit naturally next to the knot.

Voice & tone — calm intelligence

Hilo talks like someone who has everything under control, and therefore doesn’t need to raise their voice. It promises relief, not amazement — and then proves it. Full guide: BRAND_TONE_OF_VOICE.md · design tokens for agents: DESIGN.md.

Taglines & claims

In English copy, thread always closes with (Hilo) — the word is common, so the brand claims it. And a hard rule from the identity manual: never position Hilo as a meeting note-taker. Meetings are a door, not the product — Hilo is the agent that manages your tools and channels end to end.

Usage rules

Files in this kit

Every file is served from this same location — click to view, or use ↓ to download.