Trusst AI

Trusst AI is an AI application. After Refract delivered a refreshed brand for them, I uplifted the product's design system to match — rebuilding the colour and type scales, components, and light + dark themes so the product reads as one piece with the new brand and holds up as it scales.

The existing system had drifted from the product. Colour use was inconsistent across surfaces, the type scale wasn't holding, and dark mode had been bolted on rather than designed alongside light. With Refract's new brand landing, the system needed to be rebuilt to match — not patched.

• Translate the brand into the system

  Map Refract's refreshed brand into tokens the product consumes — colour, type, spacing, motion. One source of truth across Figma and code.

• Light and dark mode, designed together

  Both themes built from the same token base. Contrast, hierarchy, and component states hold in either mode without one-off overrides.

• Built to scale

  Consistent components and patterns the team can extend across the AI app's surfaces without rebuilding the foundation each time.

• Rebuilt tokens, type, and components on top of Refract's refreshed brand.
• Shipped light and dark mode at parity across the AI application.
• Tightened component and pattern consistency across the product surface.
• Set a foundation the team can extend without rework as the product grows.