Add skill: generate custom styles from app design system
Personne n'a encore pris cette issue.
Évaluation
- Difficulté
- 4/5
- Temps estimé
- 3-5 jours
- Accessibilité débutants
- 45/100
- Type d'issue
- Fonctionnalité
- Clarté
- Plutôt claire
- Activité
- À l'abandon
- Stack technique
- css, typescript
Piste de recherche
Start with the existing style definitions in renderer.ts and widget-renderer.tsx, then inspect apps/mcp/skills/, server.ts, assemble_document, and the README. Trace how MCP prompts and theme data are registered and applied. Done means the new skill and prompt are available, overrides can be applied by assemble_document, and the README includes a usage example.
Rédigé par le modèle d'indexation à partir du texte de l'issue.
Description
Summary
Create a new agent skill that analyzes the host application's existing styles (colors, typography, spacing, borders, etc.) and generates matching CSS/design tokens for UI component generation. This would allow the assemble_document tool to produce widgets that visually match the consuming application rather than using the default OpenGenerativeUI theme.
Motivation
Currently, renderer.ts ships a hardcoded design system (forked from widget-renderer.tsx). When users integrate the MCP server into their own apps, the generated widgets look like OpenGenerativeUI — not like their app. A style-extraction skill would close this gap by letting the agent adapt generated UI to the host app's look and feel.
Proposed approach
- Add a new skill file (
skills/custom-styles-skill.txt) with instructions for:- Extracting CSS custom properties, Tailwind config, or design tokens from the host app
- Mapping extracted values to the OpenGenerativeUI CSS variable schema (
--color-*,--font-*,--border-radius-*) - Generating a theme override block that
assemble_documentcan merge with the base styles
- Expose the skill via a new MCP prompt (e.g.
customize_theme) - Optionally extend the
assemble_documenttool to accept athemeOverridesparameter
Acceptance criteria
- New skill file in
apps/mcp/skills/ - Registered as an MCP prompt in
server.ts - Agent can read a target app's styles and produce a compatible CSS override
-
assemble_documentsupports applying the override - README updated with usage example
- Langage dominant
- TypeScript
- Étoiles
- 1.6k
- Forks
- 205
- Métriques de merge des PR
- Aucune PR mergée en 30 j
Préparer son environnement
- Aucun Dockerfile ni fichier Docker Compose
- Aucun modèle de pull request
- Lire le guide de contribution
Par où commencer
- Lisez l'issue en entier, puis le guide de contribution du projet.
- Signalez en commentaire que vous la prenez — cela évite que deux personnes fassent le même travail.
- Forkez le dépôt et travaillez sur une branche.
- Ouvrez une pull request qui référence le numéro de l'issue.
Autres issues de CopilotKit/OpenGenerativeUI
-
Script dedup key truncation may cause collisionsPeut-être pris @saschabuehrle l’a pris il y a 200 jours. Ouvertebug
Difficulté 2/5 1-3 heures Accessibilité débutants 72/100
-
enhancement
Difficulté 2/5 1-3 heures Accessibilité débutants 72/100
-
Difficulté 4/5 3-5 jours Accessibilité débutants 48/100
CopilotKit/OpenGenerativeUI#87 · 2 commentaires ·
-
Difficulté 5/5 Plus d'une semaine Accessibilité débutants 35/100
-
Edit existing HTML instead of regenerating from scratchPeut-être pris @jerelvelarde l’a pris il y a 186 jours. Ouverte
Difficulté 4/5 3-5 jours Accessibilité débutants 45/100
Toutes les issues de CopilotKit/OpenGenerativeUI
Issues similaires
-
Dependencies view: `getParent` loops forever on untitled documents, extension host runs out of memoryPeut-être pris Une pull request liée à cette issue est ouverte ou déjà fusionnée. Ouvertebug
Difficulté 2/5 1-3 heures Accessibilité débutants 70/100
Les mainteneurs répondent en général sous 1 jour
-
bug
Difficulté 2/5 Moins d'une heure Accessibilité débutants 82/100
awslabs/visual-asset-management-system#413 ·
Les mainteneurs répondent en général sous 1 jour
-
bug confirmed perf
Difficulté 2/5 1-3 heures Accessibilité débutants 72/100
videojs/video.js#9400 · 1 commentaire ·
Les mainteneurs répondent en général sous 1 jour
-
bug pending triage scope/agent
Difficulté 1/5 Moins d'une heure Accessibilité débutants 82/100
Les mainteneurs répondent en général sous 1 jour
-
good first issue hacktoberfest
Difficulté 2/5 Une demi-journée Accessibilité débutants 70/100
HelpCode-ai/anythingmcp#996 ·
Les mainteneurs répondent en général sous 1 jour