Quasar Vue3

Comprehensive Quasar Framework (v2) and Vue 3 development assistance. Use this skill when working with Quasar projects, components, plugins, directives, composables, CLI configuration, or building apps (SPA, SSR, PWA, Electron, Capacitor, Cordova, Browser Extensions). Triggers on Quasar-specific questions, quasar.config.js, Q-prefixed components (QBtn, QInput, QTable, etc.), Quasar CLI commands, or Vue 3 Composition API with Quasar.

5 stars 2 forksFrontend & Design

Install

skills CLI (Claude Code, Cursor, Codex and more)
npx skills add felixyakubov91/claude-quasar --skill quasar-vue3
Manual install
git clone --depth 1 https://github.com/felixyakubov91/claude-quasar.git /tmp/claude-quasar
mkdir -p ~/.claude/skills
cp -r /tmp/claude-quasar/. ~/.claude/skills/quasar-vue3

Personal skills live in ~/.claude/skills. Use .claude/skills in a project folder to share a skill with your team.

From the SKILL.md

# Quasar Vue3 Development

Quasar is a Vue 3 framework for building responsive SPAs, SSR apps, PWAs, mobile apps (Capacitor/Cordova), desktop apps (Electron), and browser extensions from a single codebase.

## Reference Documentation

All Quasar documentation is in `references/`. Use grep patterns to find relevant docs.

### Quick Reference Index

| Topic | Location | Grep Pattern |
|-------|----------|--------------|
| **Commands** | `commands/` | `refactor` |
| **Agents** | `agents/` | `component-scanner` |
| Components | `references/vue-components/` | `QBtn\|QInput\|QTable\|QCard` |
| Directives | `references/vue-directives/` | `v-ripple\|v-close-popup\|v-touch` |
| Composables | `references/vue-composables/` | `useQuasar\|useMeta\|useDialog` |
| Plugins | `references/quasar-plugins/` | `Notify\|Dialog\|Loading\|Dark` |
| Utilities | `references/quasar-utils/` | `date-utils\|color-utils\|dom-utils` |
| CLI (Vite) | `references/quasar-cli-vite/` | `quasar.config\|boot-files\|routing` |
| CLI (Webpack) | `references/quasar-cli-webpack/` | Same as Vite |
| Layout | `references/layout/` | `QLayout\|QDrawer\|QHeader\|grid` |
| Styling | `references/style/` | `sass-scss\|color-palette\|dark-mode` |
| Options | `references/options/` | `platform-detection\|screen-plugin\|i18n` |

### Build Modes

- **SPA**: `references/quasar-cli-vite/developing-spa/`
- **SSR**: `references/quasar-cli-vite/developing-ssr/`
- **PWA**: `references/quasar-cli-vite/developing-pwa/`
Read the full skill on GitHub

Details

Skill name
quasar-vue3
Repo updated
14 January 2026

FAQ

What does the Quasar Vue3 skill do?

Comprehensive Quasar Framework (v2) and Vue 3 development assistance. Use this skill when working with Quasar projects, components, plugins, directives, composables, CLI configuration, or building apps (SPA, SSR, PWA, Electron, Capacitor, Cordova, Browser Extensions). Triggers on Quasar-specific questions, quasar.config.js, Q-prefixed components (QBtn, QInput, QTable, etc.), Quasar CLI commands, or Vue 3 Composition API with Quasar.

How do I install the Quasar Vue3 skill?

skills CLI (Claude Code, Cursor, Codex and more): npx skills add felixyakubov91/claude-quasar --skill quasar-vue3. Skills go in ~/.claude/skills (personal) or .claude/skills (project), and Claude loads them automatically when a task matches the description.

Is Quasar Vue3 popular?

It lives in felixyakubov91/claude-quasar, which has 5 GitHub stars and 2 forks.

Related skills

Salgadoia Web Design Engineer Pro

5

Luispitik/salgadoia-web-design-engineer-pro

Skill end-to-end para construir webs y landings profesionales con Next.js 16, React 19, Tailwind CSS v4, shadcn/ui y Framer Motion. Pensada para que un usuario sin conocimientos técnicos pueda PREVISUALIZAR estilos en su navegador antes de elegir, y completar la página de principio a fin (intake, brief, diseño, build, QA, deploy). Combina 8 direcciones visuales narrativas (Editorial Serif, Swiss Minimal, Luxury Dark Warm, Corporate Bold, Understated Elegance, Neo-Brutalist, Playful Gradient, Retro Terminal) con 10 paletas y 10 emparejamientos tipográficos en un sistema mix-and-match con build-

Frontend & Design

Qiaomu Tldraw Skill

6

joeseesun/qiaomu-tldraw-skill

Official-first Qiaomu tldraw creation skill and workflow for building, editing, recreating, scripting, linting, testing, migrating, and packaging tldraw canvases or tldraw SDK apps with the official CLI and official LLM-friendly documentation. Use when the user asks to 画 tldraw、复刻成可编辑画布、制作流程图/信息图/课件、 创建交互或动画画布、写 custom ShapeUtil/document script、检查 .tldraw 文件, or scaffold and migrate a tldraw React application using official sources only.

Frontend & Design

Screenshot to Design System

6

WCF900905/screenshot-to-design-system

Extracts color tokens and component styles from UI screenshots by reading each control region individually (not full-page layout). Generates a complete design system demo with tokens.css and components.html. Ignores backgrounds and icons. Use when the user uploads a UI screenshot, asks for design tokens, color palette extraction, or component library generation from a reference image.

Frontend & Design

Oh My Design

6

favorPotato/oh-my-design

Use this skill when the user asks to design / mock up / prototype a UI, iterate on visual design, compare visual candidates, or explore visual approaches before implementation. Triggered by phrases like "design a UI", "mockup", "prototype the screen", "give me 3 visual options", "make it look like…", or any request that is fundamentally about look-and-feel rather than business logic. The skill writes React 18 prototypes under `<cwd>/.design/<slug>/`, hands the user a Tweaks panel to pick / iterate, and returns the selection plus a self-describing manifest the next agent can implement against.

Frontend & Design

Art Director

5

NewenergyEric/art-director-skill

Help art directors turn references, taste and samples into a shareable project pack, then guide teammates and agents to create, review and deliver consistent components. Use for art-direction setup, visual systems, multi-category production and revisions in games, UI and campaigns.

Frontend & Design

Interface Polish

6

Tsavsar/interface-polish

A checklist of concrete UI craft rules covering border radius, shadows, animation timing, typography, color tokens, accessibility, layout spacing, and microcopy. Use this skill whenever building, reviewing, or refining any web UI, component, page, landing page, or design system code, even if the user only says "make it look better", "polish this", "review my component", or asks for a button, menu, modal, form, or any frontend work. Also use it when writing UI copy like button labels, empty states, or confirmation dialogs. Distilled from the interfaces.dev cheat sheet.

Frontend & Design

Browse the most popular Claude skills, all frontend & design skills, or write your own with the skills generator.