Menu
Build and compose reusable UI components in Phoenix HEEx with Tailwind CSS.
Install with Codex or Claude Copy this prompt, paste it into Codex, Claude, or another assistant, and let it review the skill page and install it for you.
Based on SOC occupation classification
Query or modify production database records on Fly.io using SSH console and Ecto.
Add or change database-backed models using Ecto + SQLite conventions in this codebase.
Add or extend external service adapters using Req, consistent error handling, and config.
Add a new LiveView UI feature following the project's layout, routing, and testing patterns.
Build filterable/paginated list pages using embedded ViewModels and Scrivener.
| name | UI Components |
| description | Build and compose reusable UI components in Phoenix HEEx with Tailwind CSS. |
Use this skill when adding or updating UI components or shared UI patterns.
lib/web/components (prefer core.ex and ui.ex).~H templates, attr/slot declarations, and keep assigns explicit.<.icon> for icons and <.input> for form fields.Web.Layouts (flash group stays there).@apply and avoid external UI kits.