auto-skeleton

Generate CSS skeleton code with comments from HTML structure.

Updated Aug 23, 2026
One-click install
npx skills add https://github.com/yoshida55/skills --skill auto-skeleton
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: auto-skeleton
Source: https://github.com/yoshida55/skills/tree/main/auto-skeleton
Command: npx skills add https://github.com/yoshida55/skills --skill auto-skeleton

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill automates the creation of CSS skeleton code from HTML structure, saving developers time and ensuring consistency in their stylesheets.

Core Features & Use Cases

  • Generates empty CSS rulesets with comments corresponding to HTML class names.
  • Supports specific comment formatting for flexbox and grid layouts, indicating parent-child relationships and layout direction.
  • Helps in the initial stages of CSS development by providing a structural foundation.

Quick Start

Use the auto-skeleton skill to generate CSS from the provided HTML.

Frequently Asked Questions about auto-skeleton

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

FAQPage Schema
How do I generate CSS skeleton code from HTML structure?

To generate CSS skeleton code from HTML, provide your HTML structure and class names to create empty rule sets with descriptive comments. This establishes a structural foundation aligned with your HTML.

What are CSS skeleton generators and how do they help frontend development?

CSS skeleton generators automate creating empty CSS rulesets with comments from HTML, saving time and ensuring stylesheet consistency. They provide a structural foundation for initial CSS development based on class names.

Can I generate CSS comments for flex and grid layouts from HTML?

Yes, you can generate CSS comments for flex and grid layouts by using specific comment conventions in your HTML. These conventions denote hierarchy and orientation, indicating parent-child relationships and layout direction.

What is the best way to automate creating empty CSS rulesets from class names?

The best way to automate creating empty CSS rulesets from class names is using a code generation tool that parses your HTML structure. It extracts class names and outputs corresponding empty rules with descriptive comments.

Do I need any external dependencies to generate CSS from HTML structure?

No, you do not need any external dependencies to generate CSS from HTML structure. The Skill operates independently without requiring additional libraries or frameworks to produce the CSS skeleton code.