Sigil

Sigil is Omni’s design system: a unified collection of design tokens, components, and utilities for building accessible, consistent, and beautiful user interfaces across the Omni product ecosystem.

Curious to learn more about design systems, including what they are and how they work? Check out Backlight’s What is a Design System? 

What’s Included

Sigil provides:

• Design tokens for color, spacing, typography, and other visual primitives.
• Prebuilt components like buttons, inputs, and dialogs, designed with accessibility and responsiveness in mind.
• Theming support to customize appearance while maintaining consistency.
• Developer-first ergonomics to be fast, composable, and type-safe.

Core Goals

• CSS and framework agnosticism: Sigil is built on Panda CSS , a CSS-in-JS engine that compiles to static, atomic CSS. This makes it easy to decouple styling from specific frontend frameworks, enabling adoption across diverse environments.
• Customizable by anyone: Even outside the Omni ecosystem, teams can extend or override the Sigil theme to suit their brand or product needs. Panda CSS makes theme extension intuitive and scalable.
• Modern design system best practices: Sigil is built to serve as a foundation for scalable design and development collaboration, following accessibility standards and flexible architecture principles.