baseline-ui
Baseline UI — Design System Reference
When invoked, read and reference these canonical source files before answering any design question:
frontend/src/styles/global.css— design tokens (CSS custom properties)frontend/src/styles/responsive.css— breakpoints, accessibility rulesfrontend/src/components/Layout/AdminLayout.tsx— admin shell layout
Color Palette (CSS Custom Properties)
| Token | Value | Usage |
|---|---|---|
--color-primary |
#1a365d |
Navy — headings, primary buttons, brand |
--color-primary-light |
#2b6cb0 |
Links, hover states, focus outlines |
--color-secondary |
#e53e3e |
Red — CTAs, warnings, destructive actions |
--color-accent |
#38a169 |
Green — success states, positive indicators |
--color-bg |
#ffffff |
Page background |
More from colaberryintern/colaberryenterprise_ai_leadershipaccelerator
ui-ux-design
Comprehensive UI/UX design — user research, wireframes, mockups, prototyping, and design review. Invoke for new feature design, page redesign, UX audit, or user flow planning.
1frontend-design
Generate React + Bootstrap 5 frontend components and pages following the project design system. Invoke for any new page, component, layout, or visual modification.
1fixing-accessibility
Audit and fix WCAG 2.1 AA accessibility issues in React components. Invoke for accessibility reviews, screen reader support, keyboard navigation, color contrast, and ARIA attributes.
1fixing-motion-performance
Optimize CSS animations, React rendering, and bundle performance. Invoke for animation jank, slow renders, large bundle size, or transition issues.
1