skills.rest
a35506322
a35506322COMMUNITY
Explore all skills by this author →
GitHub

uiux-dev

Generate Vue.js UI designs aligned with backend API specifications using PrimeVue and Tailwind CSS.

1|Updated Jan 25, 2026
Search Tags:#frontend#vue#wireframing#tailwind#crud#uiux#primevue
One-click install
npx skills add https://github.com/a35506322/Lab.Todo --skill uiux-dev
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: uiux-dev
Source: https://github.com/a35506322/Lab.Todo/tree/main/.cursor/skills/uiux-dev
Command: npx skills add https://github.com/a35506322/Lab.Todo --skill uiux-dev

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill eliminates the inconsistency and time consumption of building Vue.js frontend interfaces that need to align with backend API specifications and project design standards, removing the need for manual guesswork during UI development.

Core Features & Use Cases

  • API-Aligned Design Guidance: Ensures all UI designs are mapped to existing backend API request/response specifications for seamless integration.
  • Pre-built UI Templates: Provides ready-to-use wireframe, dashboard, and CRUD interface templates that match the project's existing layout patterns.
  • Standardized Styling Enforcement: Mandates use of the project's approved PrimeVue component library and Tailwind CSS to maintain visual consistency across the application.
  • Use Case: When building a new todo management page for the Lab.Todo project, this Skill guides you to create a design that matches the existing dashboard layout, uses correct PrimeVue components for form inputs and data tables, and binds to the relevant todo API endpoints with mock data.

Quick Start

Ask the AI to design a new todo item creation dialog following the project's CRUD template and PrimeVue component guidelines.

Frequently Asked Questions about uiux-dev

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

FAQPage Schema
How do I align Vue.js frontend UI designs with existing backend API specifications?▼

To align Vue.js frontend UI designs with backend API specifications, you can use this Skill to map UI components directly to API request and response schemas. It generates standardized UI designs that integrate with existing API endpoints using mock data.

What is the best way to build consistent CRUD interfaces using PrimeVue and Tailwind CSS?▼

The best way to build consistent CRUD interfaces using PrimeVue and Tailwind CSS is to apply pre-built UI templates. This enforces standardized styling and ensures all data tables and form inputs match project-specific layout patterns.

How do I create wireframes for Vue.js applications that match existing project layouts?▼

To create wireframes for Vue.js applications that match existing project layouts, use this Skill to generate ready-to-use wireframe templates. These templates adhere to approved PrimeVue and Tailwind CSS styling standards for visual consistency.

Can I use this Skill to generate mock data for Vue.js CRUD interfaces?▼

Yes, you can use this Skill to generate mock-data-bound UI designs for Vue.js CRUD interfaces. It satisfies the requirement of producing standardized interfaces that bind to relevant API endpoints with mock data for frontend testing.

Does this Skill require a specific Vue component library to maintain frontend UI consistency?▼

Yes, this Skill requires the PrimeVue component library to maintain frontend UI consistency. It mandates the use of PrimeVue alongside Tailwind CSS to enforce standardized visual styling across the application.

Related Skills

Explore More Design & Creative Skills→
fengqiliufengqiliu
2

api-design

Design RESTful, GraphQL, and gRPC API specifications with schemas and versioning.

Community
Intermediate
timequitytimequity
6

feature-builder

Transform feature descriptions into UI, API endpoints, data models, and integration hooks.

Official
Advanced
bbvch-aibbvch-ai
9

design-system

Provide Vue.js, Tailwind CSS, and PrimeVue design tokens and component patterns.

Official
Intermediate
levanminhduclevanminhduc

tailwindcss

Generate Tailwind CSS utility classes and theme configurations for web frameworks.

Community
Intermediate