Manage token-based UI design and generate slides with design tokens.
npx skills add https://github.com/ll1llk/portfilo --skill design-system-ll1llk
Please help me install this Agent Skill. Skill: design-system Source: https://github.com/ll1llk/portfilo/tree/main/v0_memories/user/skills/design-system Command: npx skills add https://github.com/ll1llk/portfilo --skill design-system-ll1llk
This Skill simplifies the creation of brand-compliant presentations, manages design tokens, and specifies component behavior, reducing the complexity of systematic design and token-based UI development.
Use the design-system skill to generate slide tokens for a new presentation on 'ClaudeKit Marketing'.
High-intent search queries and answers about installing and using this skill.
To generate brand-compliant slides, this Skill applies a token-based architecture and a contextual decision system to your presentation layouts. It utilizes primitive, semantic, and component tokens to ensure visual consistency across all generated slides and UI components.
A three-layer token architecture structures design tokens into primitive, semantic, and component levels. This Skill manages this hierarchy to map raw values to meaningful UI states, ensuring consistent component specifications and brand compliance across your product.
Yes, understanding token architecture, CSS variables, and component state management is required. This prerequisite knowledge allows you to accurately define component specifications, manage variants, and implement the contextual decision system for slide generation.
Yes, you can define and document component states and variants using token-based UI architecture. The Skill manages these component specifications by binding semantic design tokens to specific UI behaviors, ensuring systematic design consistency.
The best way to maintain brand consistency is to manage a centralized design token architecture for both UI components and slide generation. This Skill enforces brand compliance by applying primitive, semantic, and component tokens across all visual outputs.
HarshodaiManage design token architecture and generate brand-compliant HTML slide decks with Chart.js.
dmedina-devGenerate brand-compliant token systems, Tailwind-ready CSS variables, component specs, and HTML slides from JSON/CSS inputs.
aagii9912Enforce brand tokens, accessibility, and component patterns in UI development.
ProfPowellOrganize CSS with layers, nesting, and design tokens.
