generic-static-design-system

Community

Pure CSS design system for static sites.

Authortravisjneuman
Version1.0.0
Installs0

System Documentation

What problem does it solve?

This Skill provides a comprehensive, no-build-tool design system for static HTML/CSS/JS websites, ensuring brand consistency and efficient UI implementation.

Core Features & Use Cases

  • Minimalist CSS: Utilizes pure CSS with custom properties for theming, responsive typography via clamp(), and CSS-only animations.
  • Component Patterns: Includes examples for accessible buttons, navigation, and interactive elements that require no JavaScript.
  • Performance Focus: Targets small file sizes and high Lighthouse scores for optimal web performance.
  • Use Case: Implement a clean, fast-loading marketing landing page adhering to a strict brand guide using only the provided CSS patterns and tokens.

Quick Start

Apply the 'pulse' animation class to an element to make it pulse with a 2-second duration.

Dependency Matrix

Required Modules

None required

Components

references

💻 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: generic-static-design-system
Download link: https://github.com/travisjneuman/.claude/archive/main.zip#generic-static-design-system

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.