agentmods.dev

cursorrules

cursorrules is a cursor rule for Cursor from flitzrrr/frontend-design-skills. It costs 569 tokens per session, scanned A, original, MIT.

A Cursor IDE rule file that points the editor to a collection of frontend design guidance. It covers areas such as layout, user experience, typography, colour, accessibility, responsive design and images.

In plain words
What is it for?
Use it to make Cursor aware of the project's design-related skills and where to find their detailed instructions.
Why use it?
It helps an agent find the relevant design guidance while working on a frontend project, instead of leaving those rules scattered or undiscoverable.

Cursor rule for Cursor

not rated 5 5mo ago A scan 569 tokens original MIT
View the source file flitzrrr/frontend-design-skills
Install

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.

agentmods
npx agentmods add rules/flitzrrr/frontend-design-skills/cursorrules
Clone the repo
git clone --depth 1 https://github.com/flitzrrr/frontend-design-skills

Made for: Cursor.

Wrote 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.

agentmods badge for cursorrules

README.md
[![agentmods](https://agentmods.dev/badge/rules/flitzrrr/frontend-design-skills/cursorrules.svg)](https://agentmods.dev/rules/flitzrrr/frontend-design-skills/cursorrules)
Your own site
<a href="https://agentmods.dev/rules/flitzrrr/frontend-design-skills/cursorrules"><img src="https://agentmods.dev/badge/rules/flitzrrr/frontend-design-skills/cursorrules.svg" alt="Measured on agentmods" height="20"></a>
Per session 569 This file is loaded in full into every session.
When invoked 569 The same file — it is already loaded in full.
Security scan A 0 findings. Scan, not verified.
Origin original No closer match found in the catalogue.
Token cost

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.

ModelPer sessionOnce invoked
Fable 5 $0.00569 $0.00569
Opus 5 $0.00284 $0.00284
Sonnet 5 $0.00114 $0.00114
Haiku 4.5 $0.00057 $0.00057

Measured 3d ago against content hash 1410479eac5d, method: parsed. Prices are Anthropic first-party input rates as of 2026-08-30, from the pricing page.

Security

Grade A, and why

cursorrules 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.

.cursorrules · 39 lines

How it starts

The opening of the file, as written. The whole thing — 39 lines — stays where its author put it; the contents beside it link to each section on GitHub.

Frontend Design Skills — Cursor Rules

This file makes skills discoverable in Cursor IDE.

For detailed skill usage, see individual SKILL.md files.

Available Skills

Core Design

  • Use skills-src/ui-design/SKILL.md for layout, grids, visual hierarchy, components, whitespace
  • Use skills-src/ux-design/SKILL.md for user research, information architecture, interaction patterns

Typography, Color & Accessibility

  • Use skills-src/web-typography/SKILL.md for font selection, pairing, fluid typography, scales
  • Use skills-src/color-theory/SKILL.md for color schemes, 60-30-10, contrast, dark mode
  • Use skills-src/accessibility/SKILL.md for WCAG, BFSG, semantic HTML, ARIA, keyboard nav

Implementation

  • Use skills-src/usability/SKILL.md for heuristic evaluation, form design, conversion
  • Use skills-src/responsive-design/SKILL.md for mobile-first, breakpoints, fluid grids
  • Use skills-src/navigation-design/SKILL.md for menu patterns, breadcrumbs, IA
  • Use skills-src/images-media/SKILL.md for image optimization, WebP/AVIF, SVG, lazy loading
  • Use skills-src/branding-identity/SKILL.md for brand strategy, corporate design, tone of voice

Strategy & Process

  • Use skills-src/customer-journey/SKILL.md for personas, touchpoints, onboarding
  • Use skills-src/design-process/SKILL.md for briefing, wireframing, prototyping, handoff
  • Use skills-src/ai-design-workflow/SKILL.md for AI integration in design workflow
  • Use skills-src/landing-pages/SKILL.md for conversion structure, CTAs, A/B testing
  • Use skills-src/website-audit/SKILL.md for site analysis, relaunch planning, SEO migration

Trends & Modern Patterns

  • Use skills-src/design-trends/SKILL.md for current award-winning patterns, motion, trends
  • Use skills-src/ui-patterns/SKILL.md for hero, cards, navigation, pricing, testimonials
  • Use skills-src/visual-direction/SKILL.md for color/typography/layout trend intelligence
  • Use skills-src/component-patterns/SKILL.md for compound components, design tokens, theming
  • Use skills-src/agent-ui-design/SKILL.md for chat interfaces, streaming UI, agent UX

Read the full file on GitHub · 39 lines

Changes

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.

  1. 3d ago First seen · 39 lines · 569 tokens per session scan A 1410479eac5d

Subscribe to this mod's changes

cursorrules is a cursor rule published in the GitHub repository flitzrrr/frontend-design-skills (5 stars, last pushed 5mo ago), licensed MIT. It adds 569 tokens to every session, about $0.0028 per session on Opus 5. 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-31.

Design and UXFrontend
Related

Other cursor rules, from other repositories

prototype-previewer

Build interactive prototype reviewers with synced review notes and Figma capture pages.

chocpink123/prototype-previewer-skill · 14 tokens

figma-performance

Handling large documents efficiently in the Plugin API.

hoshikitsunoda/figma-plugins-vibe-coding-template · 0 tokens

7-day-nextjs-web-design-cursor

A seven-day design workflow for web products that will be built in Next.js.

mattcsnyder/7-day-mobile-and-web-design-skill · 16 tokens

principle-reinterpretation-system

デザイン原則の再解釈システム - 全体ロジック説明.

livyn-inc/AI-design-system-yomogi · 0 tokens

mermaid

Diagram Creator. Load when the user requests "Create a diagram".

johnlindquist/rules · 13 tokens

angular-20

This rule provides comprehensive best practices and coding standards for Angular development, focusing on modern TypeScript, standalone components, signals, and performance optimizations.

angular/angular · 0 tokens