visual-style

Extract color, typography, and motion parameters into portable Markdown files.

21|9|Updated Jun 22, 2026
One-click install
npx skills add https://github.com/47thtechcorner/RayCodes_OpenMontage --skill visual-style-47thtechcorner
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: visual-style
Source: https://github.com/47thtechcorner/RayCodes_OpenMontage/tree/main/openmontage_engine/.agents/skills/visual-style
Command: npx skills add https://github.com/47thtechcorner/RayCodes_OpenMontage --skill visual-style-47thtechcorner

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill solves the fragmentation of design systems across different AI tools by providing a unified, portable format that ensures consistent branding, typography, and motion across all your creative outputs.

Core Features & Use Cases

  • Design System Creation: Build a complete visual-style.md file from scratch using guided prompts.
  • Style Extraction: Automatically analyze websites, videos, or PDF brand guides to generate a structured design system.
  • Multi-Tool Application: Apply your design system to HeyGen videos, HTML slides, Figma, or paper.design documents.

Quick Start

Use the visual-style skill to extract a design system from the website https://stripe.com and save it as a new visual-style.md file.

Frequently Asked Questions about visual-style

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

FAQPage Schema
How do I extract a design system from a brand guide or website?

You can create a portable visual design system by extracting color, typography, and motion parameters from URLs, videos, and PDF brand documents into a standardized Markdown file. This format ensures consistent branding across diverse AI creative tools.

Can I apply extracted design tokens directly to Figma and HeyGen?

Yes, you can automatically apply extracted design tokens to creative tools like Figma, HeyGen, HTML presentation frameworks, and paper.design. This ensures your visual identity remains consistent across all generated creative outputs.

How do I build a visual identity system from scratch using AI?

You can build a visual identity system from scratch using guided prompts to construct a complete Markdown file containing your design tokens. This process standardizes your branding parameters for automated application across different platforms.

What is the best way to maintain consistent typography and branding across AI tools?

The best way to maintain consistent typography and branding is to standardize your visual design system into a portable Markdown file. This unified format ensures all your AI tools apply identical design tokens during creative generation.

Does the visual-style skill support extracting motion parameters from videos?

Yes, the visual-style skill supports extracting motion parameters from videos alongside color and typography data. It analyzes diverse media sources to capture your complete design system dynamics into a structured format.