style-guide-generator
Generate comprehensive website style guides and design systems from URLs, screenshots, and existing documentation. Use this skill when users ask to create a style guide, design system documentation, brand guidelines document, or design specification from a website, app, or existing materials. This skill produces professional PDF outputs following industry-standard style guide structure.
Why use this skill?
Easily generate comprehensive brand style guides and design systems from URLs or images. Automate your design documentation with this professional OpenClaw skill.
Install via CLI (Recommended)
clawhub install openclaw/skills/skills/tomstools11/style-guide-generatorWhat This Skill Does
The style-guide-generator skill is a comprehensive automation tool designed to streamline the creation of professional-grade design systems and brand identity documentation. By leveraging AI to analyze input sources—including live URLs, design screenshots, and existing style documentation—this skill extracts critical design tokens such as color palettes, typographic hierarchies, logo usage rules, and layout constraints. It automatically compiles these elements into a structured, industry-standard PDF document, providing development and design teams with a unified source of truth. The skill adheres to established design systems best practices, ensuring your output covers everything from color contrast accessibility to component usage guidelines.
Installation
To integrate this tool into your OpenClaw environment, execute the following command in your terminal:
clawhub install openclaw/skills/skills/tomstools11/style-guide-generator
Ensure your system has the necessary permissions to output PDF files to your preferred workspace directory.
Use Cases
- Brand Standardization: Transform a fragmented website into a cohesive brand identity manual for internal use or stakeholder presentations.
- Design Handoffs: Quickly generate technical specifications from prototypes or existing app interfaces for engineering teams to follow.
- Onboarding Assets: Create professional, visually consistent brand guideline documents for new hires or marketing partners.
- Auditing: Analyze existing site assets to identify inconsistencies in font, spacing, or color application across different pages.
Example Prompts
- "Generate a full style guide document from the brand website at https://example.com, focusing on typography and primary brand colors."
- "I've uploaded three screenshots of our app. Please analyze the UI component patterns and colors, and compile them into a PDF design system manual."
- "Create a professional brand guidelines document using these attached notes about our mission, vision, and color palette preferences."
Tips & Limitations
- Quality Input Matters: High-resolution screenshots yield significantly more accurate typography and color extraction results.
- Iterative Refinement: If the AI misses a specific component, provide a follow-up prompt identifying the specific element for refinement.
- Accessibility: While the skill provides contrast information, always conduct a final manual review for WCAG compliance on critical production interfaces.
- Permissions: Ensure the skill has access to the provided URLs if the target website is behind a login wall.
Metadata
Not sure this is the right skill?
Describe what you want to build — we'll match you to the best skill from 16,000+ options.
Find the right skillPaste this into your clawhub.json to enable this plugin.
{
"plugins": {
"official-tomstools11-style-guide-generator": {
"enabled": true,
"auto_update": true
}
}
}Tags(AI)
Flags: network-access, file-read, file-write
Related Skills
resume-optimizer
Professional resume builder with PDF export, ATS optimization, and analysis capabilities. Use when users need to (1) Create new resumes from scratch, (2) Customize/tailor existing resumes for specific roles, (3) Analyze resumes and provide improvement recommendations, (4) Convert resumes to ATS-friendly PDF format. Supports chronological, functional, and combination resume formats.
critical-article-writer
Generate draft articles, outlines, and editorial content matching a distinctive analytical, skeptical voice with sharp critical commentary, conversational tone, and strategic humor.
transcript-to-content
This skill transforms training and onboarding meeting transcripts into structured learning materials, documentation, and actionable review content. Use this skill when processing meeting transcripts from onboarding sessions, training meetings, or knowledge transfer conversations to extract key information and generate study guides, quick reference sheets, checklists, FAQ documents, action item lists, and training effectiveness assessments.
prompt-engineering-expert
Advanced expert in prompt engineering, custom instructions design, and prompt optimization for AI agents
blog-writer
This skill should be used when writing blog posts, articles, or long-form content in the writer's distinctive writing style. It produces authentic, opinionated content that matches the writer's voice—direct, conversational, and grounded in personal experience. The skill handles the complete workflow from research review through Notion publication. Use this skill for drafting blog posts, thought leadership pieces, or any writing meant to reflect the writer's perspective on AI, productivity, sales, marketing, or technology topics.