gerar-design

Name: gerar-design
Availability: InStock
Author: ogallotti

Present interactive design choices and generate CSS token design systems.

1|Updated Apr 6, 2026

Search Tags:#design-system #landing-page #visual-identity #hero #paleta #tipografia

Ready to run

npx skills add https://github.com/ogallotti/metodo-zero --skill gerar-design

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: gerar-design
Source: https://github.com/ogallotti/metodo-zero/tree/main/plugins/metodo-zero/skills/gerar-design
Command: npx skills add https://github.com/ogallotti/metodo-zero --skill gerar-design

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill guides the creation of a landing page's visual identity by presenting interactive design options in the browser, avoiding unilateral creative choices.

Core Features & Use Cases

Presents three distinct visual directions for palette, typography, and hero.
Generates a complete design system with CSS tokens based on the chosen direction.
Opens a live browser preview to showcase the resulting identity during iteration.

Quick Start

Inicie solicitando a escolha de uma direção visual e siga as etapas para gerar o design system e a visualização.

Frequently Asked Questions about gerar-design

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

FAQPage Schema

How do I create a landing page visual identity collaboratively instead of making unilateral design choices?▼

To create a landing page visual identity collaboratively, you can use an interactive tool that presents multiple distinct visual directions for color palettes, typography, and hero layouts, allowing stakeholders to choose together.

How do I generate a CSS design system with tokens from chosen typography and color palettes?▼

You generate a CSS design system with tokens by selecting a preferred visual direction for typography and palettes, which automatically produces a complete token-based design system for the landing page.

Can I preview a landing page hero layout in the browser while iterating on the visual identity?▼

Yes, you can preview the landing page hero layout in a live browser preview that showcases the resulting visual identity and design system during the iteration process.

What is the best way to define a landing page design system end-to-end from palette selection to hero demonstration?▼

The best way to define a landing page design system end-to-end is to follow a workflow that guides you from interactive palette and typography selection through to hero and layout demonstrations with generated CSS tokens.

Does this visual identity design process support token-based CSS design systems for landing pages?▼

Yes, the visual identity design process supports token-based CSS design systems, generating complete CSS tokens directly from the collaboratively chosen color and typography directions for the landing page.