tailwind-best-practices

Malicious tool definition detected

## Scope - `packages/playground-ui` - `packages/playground` ## When to Apply Reference these guidelines when: - Writing new React components with Tailwind styles - Reviewing code for styling consistency - Refactoring existing styled components - Adding or modifying UI elements ## Priority-Ordered Guidelines Rules are prioritized by impact: | Priority | Category | Impact | | -------- | --------------- | -------- | | 1 | Component Usage | CRITICAL | | 2 | Design Tokens | C

Malicious tool definition detected

Tool: references/rules/classname-no-arbitrary.md Description: --- title: No Arbitrary Tailwind Values impact: HIGH impactDescription: Bypasses design system, breaks consistency tags: classname, arbitrary, tailwind, styling, consistency --- ## No Arbitrary Tailwind Values Never use arbitrary Tailwind values (e.g., `[#hex]`, `[13px]`) except for `height` and `width` properties where precise sizing is required.

Malicious tool definition detected

Tool: references/rules/tokens-use-existing.md Description: --- title: Use Existing Tokens from tailwind.config.ts impact: CRITICAL impactDescription: Ensures visual consistency, enables global updates tags: tokens, design-tokens, tailwind, colors, spacing, consistency --- ## Use Existing Tokens from tailwind.config.ts Only use color, spacing, and other values that are defined in the `tailwind.config.ts` file from `@playground-ui`.

Malicious tool definition detected

--- ## Abstract Styling guidelines for the Mastra Playground UI, designed for AI agents and LLMs. Contains 5 rules across 3 categories, prioritized by impact. The rules ensure consistency with the design system, prevent token drift, and maintain component library integrity.

Tool passed security scan