Components
Overview
Design system components documentation
Component Library
Our components library is built with two component layers that work together:
- @im/integral/components/primitives: Base components with core functionality and minimal styling from external libraries like shadcn
- @im/integral/components/styled: Extended components with design system theming
Architecture
Layered CSS Approach
Our components use a layered CSS architecture:
- Primitives Layer: Base component styles using Tailwind utility classes
- Brand Layer: Design system specific theme and brand colors
- Tailwind Utilities: Component-level customizations at the app level
This approach ensures consistent theming while maintaining flexibility.