skills.rest
Italo520
Italo520COMMUNITY
Explore all skills by this author →
GitHub

identidade-visual

Standardize color, typography, spacing, and component styling for Next.js Tailwind frontends.

Updated Oct 15, 2025
Search Tags:#typography#components#ui-design#design-tokens#color-palette#visual-identity#ui-guidelines
One-click install
npx skills add https://github.com/Italo520/erp_archflow_arquiteture --skill identidade-visual
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: identidade-visual
Source: https://github.com/Italo520/erp_archflow_arquiteture/tree/main/.agent/skills/identidade-visual
Command: npx skills add https://github.com/Italo520/erp_archflow_arquiteture --skill identidade-visual

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

ArchFlow's UI consistency is often compromised across projects, leading to visual drift and higher design debt. This skill provides a centralized set of visual identity guidelines to ensure uniform color, typography, spacing, and component styling across the frontend.

Core Features & Use Cases

  • Provides a cohesive color palette, typography scale, and spacing rules to standardize components.
  • Guides creation and review of UI components to maintain brand coherence during development.
  • Use Case: When designing a new dashboard, apply the identity rules to ensure buttons, cards, and typography align with the ArchFlow design system.

Quick Start

Review the palette, typography, and component rules to begin implementing the ArchFlow UI.

Frequently Asked Questions about identidade-visual

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

FAQPage Schema
How do I maintain visual identity consistency across UI components in a Next.js Tailwind frontend?▼

Standardize visual identity by loading frontmatter-driven guidelines for color palettes, typography, spacing, and component styling into your Next.js Tailwind design system to prevent visual drift.

What are design tokens and how do they enforce UI guidelines during component implementation?▼

Design tokens enforce UI guidelines by standardizing color, typography, and spacing rules as reusable values, ensuring every component aligns with the central visual identity during implementation.

Can I use these visual identity rules to review existing UI components for design debt?▼

Yes, you can review existing UI components against these visual identity rules to verify brand coherence, ensuring buttons, cards, and typography align with the design system to reduce design debt.

Does this visual identity skill require specific dependencies or components to function?▼

No, this visual identity skill has no dependencies or components, functioning purely through frontmatter-driven guidelines loaded directly by your design system.

What is the best way to standardize a color palette and typography scale for a new dashboard?▼

Apply the skill's cohesive color palette, typography scale, and spacing rules to standardize a new dashboard, ensuring all UI components maintain strict brand coherence during development.

Related Skills

Explore More Design & Creative Skills→
truchottruchot
2

direction-artistique

Define visual identity, brand language, and governance for projects.

Community
Advanced
rwHiveAquarwHiveAqua

design-advisor

Translate brand strategy into visual identity assets with typography, color, and layout specs.

Community
Basic
Adelie-SquadAdelie-Squad
17

ui-designer

Create and apply design tokens for color, typography, and spacing.

Official
Intermediate
bykoleksii-hardobykoleksii-hardo

ckm:design

Generate logos and design corporate identity programs with design tools.

Community
Advanced