Logo

›

Color

›
Gold
Amber
Violet
Azure
Teal
Porcelain
Obsidian
Gold → Amber Violet → Azure Teal → Azure

Typography

›
AaCodec Warm, with Inter on deck

About

›
10,800+buildings powered
$123M+generated savings
1,000+customers

Voice

›
Do say

“Your building saved $18,240 this quarter. Here’s where it came from.”

Imagery

›

Real buildings, real hardware

Iconography

›

Gradient tiles, duotone icons

Motion

›
Get a demo

150 – 250ms, ease-out, no bounce

Accessibility

›
Aa Aa Aa

Every pairing checked at WCAG AA

Core identity

Color

Every hue nods to temperature. Amber, Violet and Azure are the core palette: Amber brings warmth, Azure signals cool and Violet strikes the balance. Gold and Teal are accents. Porcelain and Obsidian anchor everything. Click a swatch or gradient to copy its value.

The palette

Gold#FFA53C
CoreAmber#FF6D24
CoreViolet#6B41E3
CoreAzure#0085FF
Teal#3BFFE7
Porcelain#F9F9FB
Obsidian#0C1025

Logo gradients

Gold → Amber
Violet → Azure
Teal → Azure

Subgradients

Obsidian → Amethyst
Iris → Lavender
Lilac → Moon

Product gradients

Azure → Cobalt
Lime → Emerald
Gold → Carnelian
Turquoise → Mint
Coral → Ruby
Lavender → Violet

Color as meaning

Emeraldsavings, good news
VioletRunwise, hero stats
Cobaltinformational
Turquoisehighlights, neutral
Carnelianwarnings, energy
Rubyloss, danger
Core identity

Typography

A geometric sans inspired by the constructionist logic of Futura. When Codec Warm can't be embedded, Inter is the official fallback.

The Runwise control screen
Codec Warm
ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuvwxyz 1234567890

Weights we use

Regular 400: body copy
News 500: UI, secondary text
Bold 700: headlines, stats, labels
Extrabold 800: rarely, never headlines

Our brand typeface. Use it everywhere it’s supported, from print to screen.

Fallback: Inter

Light 300
Regular 400
Semi Bold 600
Bold 700

The working font for decks and tools where Codec Warm isn’t supported.

AaDisplay 110
AaH1 62
AaH2 46
AaH3 38
AaH4 26
AaBody 16
AALabel 14
Foundation

Voice

Approachable expertise. Confident yet accessible, technical yet human. Clarity for seasoned operators and first-time supers alike, without oversimplification.

Temperature sensor installed in a home

Knowledgeable, not overly technical

We simplify complex topics so building management feels intuitive, never overwhelming.

Friendly, not casual

Warm and conversational, but clarity never loses to playfulness.

Mission-driven and trustworthy

Dependability first, in a solutions-oriented, problem-solving tone.

Confident, not arrogant

Deep expertise without sounding exclusive. Open and adaptable.

DoYour building saved $18,240 this quarter. Here’s where it came from.
Don’tLeverage our proprietary IoT-enabled optimization paradigm to maximize asset performance.
Runwise

The brand,
in one place.

Guidelines, assets, and patterns for everyone who makes something with the Runwise name on it.

Download brand assets
10,800+buildings powered
$123M+generated savings
1,000+customers
Expression

Imagery

Real buildings, real hardware, real streets. Product renders sit on soft neutral grounds with gentle shadows, never on hard white sweeps. Photos and renders get rounded corners in layout.

Building render
Buildings: light ground, street level
Temperature sensor installed on a wall
Hardware: installed and in context

Hardware renders

Temperature sensor render
Temperature sensor
Repeater render
Repeater
Smart gas mount render
Smart gas mount
Gas sensor render, back
Gas sensor, back
Expression

Motion

Motion should feel fluid and calm. Everything eases in and settles, guiding the eye without pulling at it. Every demo here is live.

Dial sweep

Fills left to right over 1.25s.

Staggered reveal

Rises 24px and fades in over 0.7s, staggered 0.08s.

Curtain wipe

Unveils left to right over 0.95s on an expo-out curve.

CTA pulse

Get a demo

A soft ring expands every 2.8s. Primary CTA only.

Hover lift

Hover me

Rises 1px with a Violet-tinted shadow over 150ms.

Never

  • Abrupt cuts, snaps or jumps
  • Bounce, spin or parallax
  • Long waits before content appears
  • Motion that steals focus

Curves: cubic-bezier(0.16, 1, 0.3, 1) for reveals, ease-out for everything else. Durations: 150 – 250ms hover, 0.7 – 1.1s reveals, 0.75 – 1.25s fills. Reduced motion settings are always respected.

Expression

Iconography

Product tiles, benefit badges and feature chips carry marketing, from print banners to one pagers and flyers. The app uses Font Awesome Duotone: a solid Violet shape with a soft Lavender companion.

Product tiles

Heating
control
Cooling
monitoring
Gas leak
detection
Toilet
monitoring

Benefit badges

Comfort
One app
Savings
Early alerts

Feature chips

Visibility
Remote
Alerts
Adjust
Automation
Comfort

App icons

Buildings
Stats
Search
Reports
Alerts
Map

Tiles and chips use one gradient per item with a shadow tinted to match. App icons are Font Awesome 6 Duotone: solid Violet with a 35% companion, white on dark.

Foundation

About

Built by property managers. Founded in 2012 and backed by leading investors like Fifth Wall and Menlo Ventures, Runwise is the most trusted building management service.

A Runwise building on a light ground
10,800+buildings powered
$123M+generated savings
1,000+customers

Vision

Accelerate the transition to healthy, sustainable, affordable cities by transforming all buildings into software platforms.

Mission

Partner with our customers so they can manage their buildings with ease and peace of mind.

23%avg. fuel reduction
95Kcars off the road
121Ktherms saved
Runwise platform on desktop and mobile
One platform to make your building smarter
Runwise wireless sensor with radar rings
Smart in one day, 100% wirelessly

What we run

Heating
control
Cooling
monitoring
Gas leak
detection
Toilet
monitoring
In practice

Accessibility

Every pairing in this book is checked for contrast. Body text is Ink on Porcelain or white; white type is reserved for Obsidian, Violet, and photography with a dark overlay. Never set copy on Gold, Amber, or Teal.

Aa
Ink / Porcelain
Aa
White / Obsidian
Aa
White / Violet
Aa
Emerald dark / light
Aa
White / Teal
Aa
White / Gold

Form pattern

Jordan
Focus: Violet border with a soft 3px ring
jordan@
Enter a full email, like name@company.com
Complete registration 48px tall, full width on mobile

Minimum body text: 14px web, 10pt print. Check every new pairing at WCAG AA or better.

Copied