Skip to content
Monk BusinessMonk BusinessMonk Business Design System

Imagery, icons and motion

Imagery and motifs

Section titled “Imagery and motifs”
  • The orbit (the symbol’s broken circle with nodes) is the brand’s single graphic motif: use it large and faint (about 14% opacity, symbol color) cropped by an edge, as in the Hero.
  • The K mark (mb-kmark, a small skewed accent bar) marks the current nav item and may precede an eyebrow. Use it at most once per view region.
  • Use diagrams for technical topics (flows such as BDR → BDO) instead of stock photos. No photos of people or offices until the company provides real ones.
Orbit, eyebrow with the K mark, K markDark · Grafite

Portabilidade numérica

O K mark marca o item atual e pode abrir um eyebrow.

KMark sozinho, decorativo.

Orbit, eyebrow with the K mark, K markLight · Gelo

Portabilidade numérica

O K mark marca o item atual e pode abrir um eyebrow.

KMark sozinho, decorativo.

Iconography

Section titled “Iconography”

There is no icon set yet. When icons are needed, use simple outline icons in the Lucide style (1.5px stroke, 20px, fg or muted) and keep them functional (close, menu, external link, send). Never use emoji as icons.

Motion

Section titled “Motion”

Keep motion functional: color and border transitions of 150ms on hover, the chat panel opening in under 200ms. No parallax, no scroll-triggered reveals, no autoplay. Respect prefers-reduced-motion by removing transitions: @monk-business/css does this for every component.