Skills
.Work. You
Rest

bulletproof-frontend

Community

Bulletproof CSS for robust frontend UI

Design & Creative#accessibility#frontend#css#responsive#design-patterns#design-systems#bulletproof
Authoraaddrick
Version1.0.0
Installs0

System Documentation

What problem does it solve?

This Skill helps teams enforce durable, readable, and accessible CSS across projects by promoting semantic patterns, modular architecture, and progressive enhancement over ad-hoc styling.

Core Features & Use Cases

  • Semantic CSS and pattern adoption: encourages BEM-like naming, CSS custom properties, and layer-based organization to keep styles scalable.
  • Responsive and accessible by default: integrates container queries, responsive sizing, and accessibility-forward patterns to ensure robust UIs.
  • Use Case: when refactoring a large app that relies on utility-first classes, this skill guides a migration to semantic CSS while preserving behavior.

Quick Start

Apply bulletproof frontend principles while authoring or reviewing CSS, HTML, and Blade templates. Start by identifying 2-3 components to refactor and replace brittle utilities with semantic CSS using the project's design tokens.

Dependency Matrix

Required Modules

None required

Components

Standard package

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: bulletproof-frontend
Download link: https://github.com/aaddrick/claude-pipeline/archive/main.zip#bulletproof-frontend

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 223,000+ vetted skills library on demand.