Can I use this to fix existing slide layouts?

Yes, the skill can analyze existing HTML files and modify their CSS and structure to bring them into full compliance with the design system.

What is the standard output format for the slides?

It generates high-definition HTML and CSS files fixed at a 1920x1080px (16:9) resolution, suitable for modern professional displays.

Does it require external CSS frameworks?

No, it generates standalone, pure CSS variables and styles based on the specific typography and spacing rules defined in the system.

What design system does this skill support?

This skill is specifically optimized for the Wolsey design system, utilizing a local 'デザインシステム.md' file for its core definitions and constraints.

Design System Applier

Name: Design System Applier
Author: tomohiro-owada

bytomohiro-owada

デザインツール

Automates the generation and modification of presentation slides by strictly enforcing design system guidelines and CSS patterns.

概要

The Design System Applier skill empowers Claude to act as a professional presentation designer by implementing the Wolsey design system. It handles the complete lifecycle of slide creation, from loading design specifications in Markdown to generating high-fidelity 1920x1080px HTML/CSS layouts. The skill features seven predefined layout patterns, including title slides and multi-column comparisons, while ensuring every element—from geometric background decorations to typography scales—remains perfectly aligned with your brand's visual identity.

主な機能

Automated generation of seven distinct slide layout patterns
Dynamic CSS implementation of complex geometric background decorations
Strict enforcement of Wolsey design system color palettes and typography
0 GitHub stars
Legacy slide retrofitting to align existing HTML with new design specs
Built-in accessibility and visual hierarchy compliance checking

ユースケース

Transforming raw text outlines into professional HTML-based presentation decks
Updating older presentation templates to match a new corporate design system
Rapidly prototyping consistent visual assets for technical demonstrations

概要

主な機能

Automated generation of seven distinct slide layout patterns
Dynamic CSS implementation of complex geometric background decorations
Strict enforcement of Wolsey design system color palettes and typography
0 GitHub stars
Legacy slide retrofitting to align existing HTML with new design specs
Built-in accessibility and visual hierarchy compliance checking

ユースケース

Transforming raw text outlines into professional HTML-based presentation decks
Updating older presentation templates to match a new corporate design system
Rapidly prototyping consistent visual assets for technical demonstrations