Haliviq
Design / Design Systems

Consistent Design
That Scales

A design system is the shared kit your whole product is built from: colours, type, spacing, buttons, forms, and patterns, defined once and reused everywhere. We build it in Figma and in code side by side, so designers and developers pick up the same parts instead of redrawing and re-coding them on every project. If your web app, mobile app, and marketing site have started to look like they came from three different companies, this is the fix. It pays off most when a second or third product is about to launch, or when several teams are shipping screens at the same time.

  • Design tokens for colour, typography, spacing, shadow, and motion, shared between Figma and code
  • A Figma component library with variants and states, plus a matching library in React, Vue, or Angular
  • Usage guidelines and a documentation site, so people know when to use which component and why
  • Accessibility checks on every component: contrast, keyboard use, focus order, and screen readers
  • Thai and English text handled properly, including line height and font fallbacks for Thai script
  • Versioning, migration notes, and a contribution process so the system keeps up with the product