Iconography

The framework in one sentence

An outline system with rounded corners that translates the warm with standards trait into visual terms: precise in construction, human in finish.

System philosophy

Outline over solid, unless there’s a justified exception. Outline conveys lightness, humility and modernity; solid conveys weight and assertion. The brand defaults to outline, in keeping with the executive humility trait. Solid is reserved for active states, hover and functional emphasis.

Rounded corners, not sharp ones. A consistent corner radius translates the warmth of the system and speaks to the rounded g of the logo.

Precise geometric construction, humanist finish. The icon is built on a strict grid (the capable trait) but finishes with rounded terminals (the warm trait). That tension is the archetype made visible: capability that doesn’t need to announce itself.

Consistent visual density across icons. A user icon and a settings icon should carry roughly the same visual mass. Without that discipline, some icons shout and others whisper.

Variant system

Regular (outline). The default state. All standard UI.

Filled (solid). Active, hover, selected states, notifications with a counter. The filled variant is used for state, not for decoration.

Duotone. Editorial hero icons that need more visual presence. Neutral line with an orange fill. Reserved for service categories, editorial section openers and illustrative moments.

Using color in icons

An icon’s color is inherited from the context it lives in. Icons are not blocks of color; they are graphic elements that reinforce the typographic reading.

• On light backgrounds: warm black.
• On dark backgrounds or an orange block: warm white.
• Active state or prominent hover: primary orange.
• Editorial duotone: neutral with a primary orange fill.

Orange is not an icon color by default. Its use is restricted to active states, prominent hover and the duotone variant. Without that restriction, the system overuses orange and dilutes it as a visual signature.

Categories in the base set

The system starts with a set organized into six functional categories, covering current communication and interface needs.

People and team. Profiles, talent sections, case studies, client relationships.

Communication. Contact, CTAs, social media, conversation channels.

Action and navigation. Buttons, controls, filters.

Work and process. Timelines, processes, actions on content.

Technology. Technical cases, services, engineering blog posts.

Metrics and achievements. Case studies, verifiable metrics, results sections.

New icons are added on real demand, always following the system’s philosophy.

Application

When to use icons. Reinforcing an action in a button. Wayfinding in navigation. Fast visual categorization in lists or cards. Empty states where the icon communicates before the text does.

When not to use icons. As free decoration with no communicative function. As a substitute for critical text: an icon never replaces an accessible label, it accompanies one. As the brand’s visual signature: that role belongs to the logo.

The text-companion rule. In every UI context the icon carries a textual or accessible label. Never an icon alone with no associated text, except in contexts where the meaning is universally recognized — and even then, with an aria-label.

Accessibility

Icons as visual elements meet WCAG 2.1 level AA criteria. The technical specifications for minimum touch target, non-text contrast and ARIA roles are documented in the operational design system.