skills.rest
PavelLizunov
PavelLizunovCOMMUNITY
Explore all skills by this author →
GitHub

merge-design-handoff

Process Codex.ai design handoff bundles and map CSS tokens to Avalonia XAML resources.

3|1|Updated Feb 20, 2026
Search Tags:#automation#design#codex#handoff#tokens#avalonia
One-click install
npx skills add https://github.com/PavelLizunov/VPNRouter --skill merge-design-handoff
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: merge-design-handoff
Source: https://github.com/PavelLizunov/VPNRouter/tree/main/.agents/skills/merge-design-handoff
Command: npx skills add https://github.com/PavelLizunov/VPNRouter --skill merge-design-handoff

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill bridges the gap between design prototypes and production code by automating the ingestion and mapping of design tokens and intent from Codex.ai handoff bundles.

Core Features & Use Cases

  • Automated Handoff Processing: Fetches, extracts, and parses design bundles directly from Codex API URLs.
  • Semantic Token Mapping: Automatically maps CSS design tokens to existing Avalonia DynamicResource tokens to maintain design system consistency.
  • Intent Extraction: Analyzes chat transcripts and design documentation to ensure implementation matches user-approved design decisions.

Quick Start

Provide the Codex design handoff URL to the agent to begin the automated extraction and implementation mapping process.

Frequently Asked Questions about merge-design-handoff

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

FAQPage Schema
How do I convert Codex.ai design tokens to Avalonia XAML resources?▼

To convert Codex.ai design tokens to Avalonia XAML resources, this skill fetches gzipped tar archives and maps CSS design tokens to Avalonia DynamicResource tokens. This semantic mapping preserves design system consistency during production-ready UI implementation.

What is a design handoff bundle and how does automated processing work?▼

A design handoff bundle is a gzipped tar archive containing design specifications and chat transcripts. Automated processing extracts these bundles directly from Codex API URLs, parsing visual prototypes and intent documentation to match existing application design systems.

How do I extract design intent from chat transcripts for UI implementation?▼

Extracting design intent from chat transcripts involves analyzing design documentation within the handoff bundle to ensure implementation matches user-approved design decisions. This process bridges the gap between visual prototypes and production code.

Can I use this skill to map CSS design tokens to an existing Avalonia application design system?▼

Yes, you can map CSS design tokens to an existing Avalonia application design system. The skill matches visual prototypes to existing application design systems by mapping tokens to Avalonia DynamicResource entries.

What do I need to provide to start the Codex design handoff extraction process?▼

To start the Codex design handoff extraction process, you need to provide the Codex design handoff URL to the agent. The skill then fetches, extracts, and parses the gzipped tar archive automatically.

Are there limitations when processing design handoffs for Avalonia UI implementation?▼

Limitations when processing design handoffs for Avalonia UI implementation include relying entirely on the accuracy of the Codex.ai bundle and the alignment of CSS tokens with your existing DynamicResource tokens. Successful semantic mapping depends on consistent design system structure.

Related Skills

Explore More Design & Creative Skills→
oaldersoalders
4

implement-design-handoff

Automates design-system component integration into app code and GitHub issue creation.

Community
Intermediate
linuxdevellinuxdevel
27

avalonia-pro-max/components

Automate Avalonia UI screen construction from reusable XAML component recipes.

Community
Advanced
AincFhAincFh

ckm:design-system

Generate design tokens and slide templates from a unified token system.

Community
Advanced
takapomtakapom

figma

Extract Figma design data and generate React Native components and design tokens.

Community
Advanced