SkillFoxx

Symfony UX Skills

Skills for the Symfony UX frontend stack: Stimulus, Turbo, TwigComponent, LiveComponent, UX Icons and UX Map, with patterns and gotchas

  • 185 ★ on the repository
  • Last commit
  • MIT
Skill

Minimal access

Why this level

  • The set consists of references and guidance and runs no code
All reasons and checks

smnandre/symfony-ux-skillsAuthor:Simon Andre

Install

In your terminal, with SkillFoxx CLI

npx skillfoxx add skills/symfony-ux-skills

Detects the agents on your machine, shows the access level and pins the version.

Other ways to install

Access and checks

How we review

Minimal accessThe tool runs nothing and makes no network calls.

  • The set consists of references and guidance and runs no code

This is third-party code. Review the repository files before installing.

What it does

The set gives the agent working knowledge of the Symfony UX frontend stack. An orchestrator skill helps pick the right tool, and specialized skills cover Stimulus, Turbo, TwigComponent, LiveComponent, UX Icons and UX Map. Each skill has references on API, patterns and gotchas. The agent chooses the right tool for the task: reactive forms, partial page updates, reusable components, icons or maps.

Who it is for. For Symfony developers who build the interface with the UX stack and minimal JavaScript.

Good fit when

  • You write a Symfony UX frontend and want guidance on a specific package
  • You are unsure whether to pick Stimulus, Turbo or LiveComponent for a task
  • You need patterns and warnings about common mistakes in the stack

Not a fit when

  • The project is not on Symfony and does not use the UX stack
  • You need a frontend framework outside the Symfony ecosystem
  • General knowledge is enough without per-package references

Example request

Build a live product-list search with a LiveComponent and server-side validation

Limitations

The skills describe the Symfony UX stack and are useful only in projects that use it. This is reference material that guides the agent; the Symfony UX packages themselves you install separately via Composer and npm. MIT licensed.

How to disable. Uninstall the symfony-ux-skills plugin through the plugin manager or remove the copied skill folders from the agent's directory.

FAQ

How many skills are in the set?

An orchestrator skill for choosing a tool and six specialized ones: Stimulus, Turbo, TwigComponent, LiveComponent, UX Icons and UX Map.

Which agents does it work with?

It names Claude, Gemini and Codex; install as a Claude Code plugin, via the Skills CLI, or by copying folders.

Discussion

No questions or reviews yet.

Skills

Skills for design engineers: quick UI cleanup, accessibility, metadata and animation performance fixes

SkillMinimal access11K

Skills against boilerplate-looking UIs: layout, type, motion and spacing, plus reference image generation for web and mobile

SkillMinimal access114.1K113

45 enterprise UX skills for agents: palettes, typography, forms, WCAG accessibility and usability review of an interface.

SkillMinimal access192

Two UI/UX skills teach an agent design decisions: track selection, tokens, component recipes and anti-slop guardrails.

SkillMinimal access177

A skill with 107 styles, 127 palettes and 107 font pairings that generates a design system and audits interface code

PluginMinimal access100

A registry of installable design skills: ready SKILL.md and DESIGN.md files with tokens, component rules and accessibility for different styles

SkillMinimal access3.6K

README in short

The README presents a skill set for the Symfony UX frontend stack by Simon Andre. A table lists the skills, what they do and when the agent activates them; most have references on API, patterns and gotchas. Install is offered as a Claude Code plugin, via the Skills CLI with npx skills add, or by manually copying folders for Claude Code, Gemini CLI and Codex. It also links the upstream Symfony UX packages on Packagist. MIT licensed.

README badge

Original SKILL.md

---
name: symfony-ux
description: Symfony UX frontend stack -- decision tree and orchestrator for choosing between Stimulus, Turbo, TwigComponent, LiveComponent, UX Icons, and UX Map. Use when the user is unsure which tool fits, wants to combine multiple UX packages, or asks a general frontend architecture question in Symfony.
license: MIT
metadata:
  author: Simon Andre
  version: "1.2.0"
---

# Symfony UX

Modern frontend stack for Symfony. Build reactive UIs with minimal JavaScript using server-rendered HTML.

Symfony UX follows a progressive enhancement philosophy: start with plain HTML, add interactivity only where needed, and prefer server-side rendering over client-side JavaScript. Each tool solves a specific problem -- pick the simplest one that fits.

## Decision Tree: Which Tool?

Need frontend interactivity?
- Pure JavaScript behavior (no server) -> Stimulus
- Navigation / partial page updates -> Turbo
- Reusable UI component -> TwigComponent or LiveComponent
- Need icons -> UX Icons
- Need an interactive map -> UX Map

Report a problem