Stop writing Angular rules from scratch. Generate them in 10 seconds.
Select your Angular version and preferences. Get a complete, official-standard angular.mdc rules file for Cursor IDE. Copy. Done.
Before vs After
What building Angular cursor rules looks like - with and without this tool.
- •Writing cursor rules manually from scratch
- •Inconsistent best practices across the codebase
- •Outdated patterns for your Angular version
- •Hours of configuration and research
- •Version-specific rules generated instantly
- •Follows official Angular team recommendations
- •Consistent codebase standards from day one
- •Ready to use in seconds, not hours
What's Included
Everything you need for a production-ready angular.mdc file.
Version-Aware Rules
Rules adapt to your Angular version (v15-v21). New APIs like Signals, @if/@for, and Signal Forms appear only when supported.
Official Best Practices
Built on the angular.mdc file recommended by the Angular team for AI-assisted development.
Fully Customizable
Choose RxJS vs Signals, @Input()/@Output() vs input()/output(), structural directives vs built-in control flow.
Your rules, your way
Every team writes Angular differently. The builder adapts to how your team actually works - not how a tutorial says you should.
State Management
How your components manage and share reactive data.
new BehaviorSubject<T>(initial)
Battle-tested reactive streams. Best for complex async flows, event composition, and projects already invested in RxJS operators.
signal<T>(initial)
Simpler, synchronous reactivity. Great for local component state, derived values with computed(), and projects that want less boilerplate.
Template Control Flow
How your templates handle conditionals and loops.
*ngIf="show" *ngFor="let item of items"
The original Angular approach. Familiar to every Angular developer. Still works in all versions, but no longer recommended for new projects.
@if (show) { } @for (item of items; track item.id) { }
Native syntax baked into the compiler. Better type checking, no extra imports, and unlocks @empty and @defer blocks.
Component Inputs and Outputs
How your components communicate with their parents.
@Input() name: string
@Output() clicked = new EventEmitter()
The classic approach. Familiar, well-documented, and supported everywhere. Still the majority of existing Angular code.
name = input<string>()
clicked = output()
Function-based API that works with Signals. Required inputs, aliasing, and transforms are built in. Less ceremony, better type inference.
How It Works
Three steps. Ten seconds. Done.
Pick your version
Select Angular v15 through v21.
Set your preferences
Choose state management, control flow, change detection, and I/O approach.
Copy your rules
One-click copy of the complete angular.mdc file.
Supported Angular Versions
Every version unlocks more capabilities.
Angular v15
Base rules - TypeScript strict mode, standalone components, services, and RxJS patterns.
Angular v16+
Unlocks Signals and input()/output() function-based component I/O.
Angular v17+
Unlocks built-in control flow - @if, @for, @switch - replacing structural directives.
Angular v18 - v20
Unlocks resource() API, linkedSignal(), zoneless change detection, and effect() for side effects.
Angular v21 (Latest)
Zoneless by default, experimental Signal Forms, Vitest as default test runner, and Angular Aria.
Frequently Asked Questions
Why does Cursor keep writing outdated Angular code?
Without cursor rules, Cursor has no way to know which Angular version you're on or which patterns your team prefers. It falls back on generic training data - mixing NgModules with standalone components, using deprecated APIs, or ignoring Signals entirely. A rules file fixes this by giving the AI explicit, version-aware instructions for your project.
What is angular.mdc?
It's a rules file that Cursor IDE uses to understand Angular best practices when generating code. It tells the AI how your project should be structured, what patterns to follow, and which APIs to prefer.
How do I add cursor rules to my Angular project?
Generate the rules with this tool, copy the output, and save it as angular.mdc in your project's .cursor/rules/ directory. Cursor IDE picks it up automatically - no configuration needed.
Is it based on official Angular guidelines?
Yes. It's built on the Angular team's recommended cursor rules file for AI-assisted development, adapted to your specific Angular version and preferences.
Does it support older Angular versions?
Yes, from Angular v15 through v21. Rules adapt automatically - newer APIs and patterns only appear when supported by your selected version.
What's the difference between Signals and RxJS in this context?
Both are state management approaches. RxJS uses BehaviorSubject and reactive streams - the traditional Angular pattern. Signals, introduced in Angular v16, offer a simpler, synchronous reactive primitive. The builder generates rules matching whichever approach your team uses.
Can I modify the generated rules?
Yes. Copy the generated file and customize it further for your team's conventions. The output is plain Markdown - edit it however you like.
Do I need to regenerate rules when upgrading Angular?
Yes - it takes 10 seconds. Select your new Angular version, adjust preferences if needed, and copy the updated rules. This ensures your cursor rules match the APIs and patterns available in your new version.
Is this tool free?
Yes, completely free. No sign-up, no account, no limits. Generate as many rule files as you need.
Want to learn more about cursor rules, Signals vs RxJS, or AI-assisted Angular development?
Read the blogYour codebase deserves consistent rules. Generate them now.
Generate Angular RulesFree. 10 seconds. No sign-up.