convention-keeper-brutalist-ui

Name: convention-keeper-brutalist-ui
Availability: InStock
Author: dafum

Audit UI components for brutalist conventions and design-system alignment.

1|Updated Jan 6, 2026

Search Tags:#design-system #css-variables #import-order #tailwind-v4 #ui-conventions #code-refactor #brutalist

Ready to run

npx skills add https://github.com/DaFum/neurotoxic-game --skill convention-keeper-brutalist-ui

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: convention-keeper-brutalist-ui
Source: https://github.com/DaFum/neurotoxic-game/tree/main/.agents/skills/convention-keeper-brutalist-ui
Command: npx skills add https://github.com/DaFum/neurotoxic-game --skill convention-keeper-brutalist-ui

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Enforce brutalist UI conventions across components to ensure consistency, naming alignment, and predictable import order during UI refactors.

Core Features & Use Cases

Verify CSS variable usage (no hardcoded colors) and ensure Tailwind v4 syntax.
Encourage reuse of shared components from src/ui/shared/ and maintain consistent naming conventions.
Produce a violation checklist with file paths and suggested fixes during UI refactors or design-system alignment.

Quick Start

Run the Brutalist UI audit to verify components align with CSS variable usage, Tailwind v4 syntax, and import order.

Frequently Asked Questions about convention-keeper-brutalist-ui

High-intent search queries and answers about installing and using this skill.

FAQPage Schema

How do I enforce brutalist UI conventions during a component refactor?▼

Auditing brutalist UI components verifies CSS variable usage and Tailwind v4 syntax to catch hardcoded colors and naming inconsistencies. It produces a violation checklist with file paths and suggested fixes for proper design-system alignment.

Can I check for hardcoded colors and Tailwind v4 syntax errors in my codebase?▼

Running a brutalist UI audit checks for hardcoded colors by verifying CSS variable usage and validates Tailwind v4 syntax. It outputs a violation checklist with file paths and suggested fixes to correct codebase inconsistencies.

Does the brutalist UI audit check shared component reuse and import order?▼

The brutalist UI audit checks shared component reuse by verifying imports from the shared UI directory and enforces proper import ordering. It outputs a violation checklist with file paths and suggested fixes to correct structural inconsistencies.

What is the best way to align a codebase with brutalist design-system rules?▼

Aligning a codebase with brutalist design-system rules requires running an audit during UI refactors. It checks CSS variables, Tailwind v4 syntax, and shared component reuse to produce a violation checklist with file paths and suggested fixes.

Why does my brutalist UI audit produce a violation checklist with file paths?▼

The brutalist UI audit produces a violation checklist with file paths to pinpoint exact design-system misalignments. It identifies hardcoded values, incorrect Tailwind v4 syntax, and import order issues, providing suggested fixes for each violation.

When should I run a brutalist UI convention check on my components?▼

Run a brutalist UI convention check during UI refactors, redesigns, and codebase cleanups. It verifies CSS variable usage, Tailwind v4 syntax, and import ordering to ensure design-system alignment and outputs a violation checklist with suggested fixes.