\DESIGNSORCERY>_

A Better Way to Manage Workplace Compliance

Video · Light

Design System Inspiration

Workhub — extracted via DESIGN.md

HR · Workplace compliance

corporate clean minimalist animated typographic split-screen hero sticky navigation scroll-triggered animations card-based layout

Typography

Poppins

Heading

Aa Aa Aa Aa

-apple-system

Body

Aa Aa Aa Aa

Color palette

TL;DR

Workhub is a high-utility compliance platform that balances professional density with high-energy brand accents. The system is anchored by **Poppins**, a geometric sans-serif used across all hierarchy levels from 55px display headers to 12px captions. The primary brand voltage is delivered via a saturated orange (`#f05123`), used exclusively for primary actions and critical highlights. Surfaces are predominantly white (`#ffffff`) or a very light cool gray (`#f8f8fc`), with depth created through large, soft shadows (`rgba(12, 0, 46, 0.1)`) rather than heavy borders.

Target audience

The site targets small to medium-sized businesses seeking an efficient and reliable software solution for managing workplace compliance and recognition programs.

Full tech stack

dc.js Gatsby Google Tag Manager Prismic React Webpack

Analytics

Google Tag Manager

Meta description

Workhub provides compliance software and recognition programs that help small and medium-sized businesses create and maintain safe, aligned, and diligent workplaces.

Brand Voice

Practical, comprehensive, and encouraging.

Positioning

Workhub is an all-in-one safety and compliance management platform designed to simplify worker safety through a suite of customizable tools. It serves organizations looking for an affordable, user-friendly way to manage training, policies, and worker recognition.

Voice principles

  • Comprehensive: Emphasize the breadth of the "all-in-one" system and the "entire suite" of features.
  • Accessible: Use plain language to describe complex compliance tasks, focusing on "easy adoption" and "simplifying" workflows.
  • Supportive: Maintain a positive outlook on workplace culture by using words like "celebrate," "encourage," and "kudos."
  • Transparent: Be upfront about costs and capabilities, using direct phrases like "no hidden fees" and "no contracts."

More SaaS Designs

← Back to Gallery