Getting it into your agent
One page per mod, every tool's command on it. A separate URL per tool would split the same page into five that compete with each other.
npx agentmods add rules/chihebnabil/lovable-boilerplate/designgit clone --depth 1 https://github.com/chihebnabil/lovable-boilerplateWrote this? Show the measurements
A badge with what this costs and how it scanned, read live from this page, so it follows the numbers instead of freezing them. Markdown for a README, HTML for a documentation site or a project page.
[](https://agentmods.dev/rules/chihebnabil/lovable-boilerplate/design)<a href="https://agentmods.dev/rules/chihebnabil/lovable-boilerplate/design"><img src="https://agentmods.dev/badge/rules/chihebnabil/lovable-boilerplate/design.svg" alt="Measured on agentmods" height="20"></a>What it costs to keep this loaded
Counted locally with the o200k_base tokenizer, which is exact for GPT models; Claude uses its own tokenizer and its counts differ. Treat this as one consistent yardstick across the catalogue rather than a bill. Prices are per million input tokens.
| Model | Per session | Once invoked |
|---|---|---|
| Fable 5 | $0.00000 | $0.01349 |
| Opus 5 | $0.00000 | $0.00674 |
| Sonnet 5 | $0.00000 | $0.00270 |
| Haiku 4.5 | $0.00000 | $0.00135 |
Grade A, and why
design scanned grade A with 0 findings against 26 rules in 11 categories — prompt injection, anti-refusal, data exfiltration, privilege escalation, supply chain, agent snooping, system-prompt leakage, SSRF and excessive agency — measured 3d ago.
A static scan of the body, not an audit. Every finding is printed with the line that produced it so you can judge whether it matters here. A mod is markdown that instructs an agent; that is exactly why what it instructs is worth reading.
Nothing flagged
None of the 26 patterns this scan looks for appear in this file: no shell pipes, no recursive deletes, no credential paths, no hidden text, no instruction-override or anti-refusal phrasing, no agent-config snooping. That is not a guarantee, it is the absence of the things that are checkable.
How it starts
The opening of the file, as written. The whole thing — 135 lines — stays where its author put it; the contents beside it link to each section on GitHub.
Design System Rules
CRITICAL DESIGN REQUIREMENTS
Accessibility Standards (WCAG 2.1 AA)
- TEXT CONTRAST: Minimum 4.5:1 ratio for normal text
- LARGE TEXT: Minimum 3:1 ratio for 18pt+ text
- FOCUS STATES: All interactive elements must have visible focus indicators
- COLOR INFORMATION: Never rely solely on color to convey information
Safe High-Contrast Combinations
// Light backgrounds
bg-white text-slate-900 // 21:1 ratio
bg-slate-50 text-slate-800 // 16.7:1 ratio
bg-blue-50 text-blue-900 // 14.2:1 ratio
// Dark backgrounds
bg-slate-900 text-white // 21:1 ratio
bg-slate-800 text-slate-100 // 15.8:1 ratio
bg-blue-900 text-blue-50 // 18.1:1 ratio
NEVER USE These Low-Contrast Combinations
bg-slate-400 text-white // Only 3.1:1 ratio
text-slate-400 on bg-white // Common mistake
text-slate-500 on bg-slate-100 // Poor secondary text
border-slate-400 text-slate-400 // Poor outline buttons
Industry-Specific Design Psychology
Technology & SaaS
- Color Psychology: Modern, innovative, forward-thinking palettes with high-tech feeling
- Typography: Clean geometric sans-serif with futuristic character
- Visual Style: Minimal, data-driven, sophisticated gradients and depth
- Animation: Smooth, precise micro-interactions that feel cutting-edge
- Emotional Tone: Innovation, efficiency, technological advancement
Finance & Banking
- Color Psychology: Trustworthy, stable, premium tones that convey security
- Typography: Professional typography mixing authority with approachability
- Visual Style: Clean, sophisticated, confidence-building with subtle luxury
- Animation: Subtle, professional interactions that reinforce reliability
- Emotional Tone: Trust, stability, professional competence
Healthcare & Medical
- Color Psychology: Calming, clean, trustworthy palette promoting wellness
- Typography: Highly readable, accessible fonts prioritizing clarity
- Visual Style: Clean, sterile-feeling but warm, emphasizing care and precision
- Animation: Gentle, non-distracting transitions that don't overwhelm
- Emotional Tone: Care, trust, healing, accessibility
What this file has done since we first saw it
Hashed on every crawl. A supply-chain change to an agent config is a question of when, not whether, so the history is kept rather than the latest state alone.
- 3d ago First seen · 135 lines · 0 tokens per session scan A 6d21201cf2c3
design is a cursor rule published in the GitHub repository chihebnabil/lovable-boilerplate (65 stars, last pushed 1mo ago), licensed MIT. It costs nothing until one of its globs matches a file; then it loads 1,349 tokens. A static security scan graded it A with 0 findings. No closer match exists in the catalogue, so it is treated as the original; first seen 2026-08-30.
Other cursor rules, from other repositories
mcp
Guidelines for implementing and interacting with the Task Master MCP Server.
new_features
Guidelines for integrating new features into the Task Master CLI.
tests
Guidelines for implementing and maintaining tests for Task Master CLI.
utilities
// ✅ DO: Create focused, reusable utilities /.
commands
Guidelines for implementing CLI commands using Commander.js.
dev_workflow
Guide for using Taskmaster to manage task-driven development workflows.