brand-guidelines
EquipQR Brand Styling
Overview
Use this skill whenever Cursor should style an output to look like EquipQR (docs, UI mockups, slide decks, diagrams, emails, etc.). It summarizes the source-of-truth design tokens used by the EquipQR app so outputs stay consistent with the product.
Keywords: branding, corporate identity, visual identity, post-processing, styling, brand colors, typography, EquipQR brand, design tokens, Tailwind, shadcn/ui, visual formatting, visual design
Brand Guidelines
Source of truth
- Design tokens:
src/index.css(CSS variables under:rootand.dark) - Tailwind mapping:
tailwind.config.ts(colors likeprimary,secondary,success,info,warning,destructive, andbrandmap to CSS variables)
Colors
EquipQR uses token-based colors (HSL triplets) so the same semantic color names work in light and dark mode. Prefer semantic tokens (brand, primary, secondary, foreground, muted-foreground, etc.) over hard-coded hex values.
More from columbia-cloudworks-llc/equipqr
postgres-best-practices
Postgres performance optimization and best practices from Supabase, adapted to EquipQR's Supabase (Postgres + RLS) workflow. Use when editing SQL, migrations, indexes, or RLS policies.
6react-best-practices
React performance optimization guidelines from Vercel Engineering, with EquipQR-specific mappings (Vite + React Router + TanStack Query). Use when writing, reviewing, or refactoring React code in this repo, especially around waterfalls, bundle size, and re-renders.
6playwright-cli
Automates browser interactions for web testing, form filling, screenshots, and data extraction. Use when the user needs to navigate websites, interact with web pages, fill forms, take screenshots, test web applications, or extract information from web pages.
3