svelte-expert-pro — svelte-expert-pro install svelte-expert-pro, inasistig, community, svelte-expert-pro install, ide skills, ux design with svelte-expert-pro, modern ui design with svelte-expert-pro, Claude Code, Cursor, Windsurf

v1.0.0
GitHub

About this Skill

Ideal for Frontend Agents specializing in modern web development with SvelteKit and Svelte 5, focusing on UX design and accessibility. svelte-expert-pro is a specialized skill for developers, emphasizing Svelte ecosystem expertise, particularly in SvelteKit, Svelte 5, and UX educational design.

Features

Implements $state, $derived, $effect, and $props using Svelte 5 Runes
Utilizes modern reactivity with Svelte 5
Designs accessible and minimalist UI interfaces
Applies native SvelteKit development for efficient applications
Avoids outdated $: syntax for optimal performance
Develops with a focus on user experience (UX) and modern design principles

# Core Topics

ceslep ceslep
[0]
[0]
Updated: 3/8/2026

Agent Capability Analysis

The svelte-expert-pro skill by ceslep is an open-source community AI agent skill for Claude Code and other IDE workflows, helping agents execute tasks with better context, repeatability, and domain-specific guidance. Optimized for svelte-expert-pro install, ux design with svelte-expert-pro, modern ui design with svelte-expert-pro.

Ideal Agent Persona

Ideal for Frontend Agents specializing in modern web development with SvelteKit and Svelte 5, focusing on UX design and accessibility.

Core Value

Empowers agents to craft modern, accessible interfaces using Svelte 5's reactivity features such as $state, $derived, $effect, and $props, along with SvelteKit for streamlined development, ensuring a seamless user experience through minimalist and responsive UI design.

Capabilities Granted for svelte-expert-pro

Building responsive and accessible web applications with SvelteKit
Implementing modern reactivity patterns using Svelte 5's Runes
Designing minimalist and user-friendly interfaces with a focus on UX

! Prerequisites & Limits

  • Requires knowledge of Svelte and JavaScript
  • Focused on Svelte 5 and SvelteKit, may not be compatible with older versions
Labs Demo

Browser Sandbox Environment

⚡️ Ready to unleash?

Experience this Agent in a zero-setup browser environment powered by WebContainers. No installation required.

Boot Container Sandbox

svelte-expert-pro

Install svelte-expert-pro, an AI agent skill for AI agent workflows and automation. Works with Claude Code, Cursor, and Windsurf with one-command setup.

SKILL.md
Readonly

🧠 Perfil de la Skill: Especialista en Ecosistema Svelte & UX Educativo

Actúa como un desarrollador experto en SvelteKit y Svelte 5 (Runes), con un enfoque agudo en la experiencia de usuario (UX) y el diseño de interfaces (UI) modernas, accesibles y minimalistas.

🛠️ Directrices Técnicas de Desarrollo

1. Svelte 5 & Reactividad Moderna

  • Uso de Runes: Implementa $state, $derived, $effect y $props de forma nativa. Evita la sintaxis antigua de etiquetas $: a menos que sea estrictamente necesario por compatibilidad.
  • Componentización: Crea componentes atómicos, reutilizables y con tipos claros (TypeScript preferido).
  • Optimización: Prioriza el renderizado del lado del servidor (SSR) y la hidratación progresiva para tiempos de carga instantáneos.

2. UI/UX & Styling con Tailwind CSS

  • Design System: Implementa un diseño limpio basado en una escala de grises suave con colores de acento vibrantes (ej. indigo-600 para acciones primarias).
  • Mobile First: Todo componente debe ser totalmente responsivo y táctil.
  • Buenas Prácticas de UI:
    • Uso de Empty States elegantes cuando no hay datos de asignaturas.
    • Skeletons de carga para peticiones asíncronas.
    • Microinteracciones suaves usando svelte/transition.
    • Contraste de color AA/AAA para accesibilidad en entornos educativos.

3. Integración de Datos (Data Bridge)

  • Backend PHP/MySQL: Al detectar lógica de servidor, estructura las peticiones fetch asumiendo endpoints RESTful o controladores PHP.
  • Validación: Implementa manejo de errores robusto (Try/Catch) y notificaciones (Toasts) para el feedback del usuario.
  • Seguridad: Asegura la sanitización de datos antes de enviarlos a las APIs de PHP.

🎓 Contexto Institucional & Negocio

  • Nomenclatura Estricta: Respeta rigurosamente el formato de nombres de Asignaturas y Períodos Escolares definido por la Institución Educativa.
  • Flujos Académicos: Optimiza las interfaces para la gestión de exámenes, calificaciones y asistencia, minimizando la cantidad de clics necesarios para el docente.

📝 Estándar de Salida (Output)

  • Entrega código limpio, documentado y listo para copiar/pegar.
  • Si el componente es complejo, incluye una breve explicación de la decisión de UX tomada.

FAQ & Installation Steps

These questions and steps mirror the structured data on this page for better search understanding.

? Frequently Asked Questions

What is svelte-expert-pro?

Ideal for Frontend Agents specializing in modern web development with SvelteKit and Svelte 5, focusing on UX design and accessibility. svelte-expert-pro is a specialized skill for developers, emphasizing Svelte ecosystem expertise, particularly in SvelteKit, Svelte 5, and UX educational design.

How do I install svelte-expert-pro?

Run the command: npx killer-skills add ceslep/inasistig/svelte-expert-pro. It works with Cursor, Windsurf, VS Code, Claude Code, and 19+ other IDEs.

What are the use cases for svelte-expert-pro?

Key use cases include: Building responsive and accessible web applications with SvelteKit, Implementing modern reactivity patterns using Svelte 5's Runes, Designing minimalist and user-friendly interfaces with a focus on UX.

Which IDEs are compatible with svelte-expert-pro?

This skill is compatible with Cursor, Windsurf, VS Code, Trae, Claude Code, OpenClaw, Aider, Codex, OpenCode, Goose, Cline, Roo Code, Kiro, Augment Code, Continue, GitHub Copilot, Sourcegraph Cody, and Amazon Q Developer. Use the Killer-Skills CLI for universal one-command installation.

Are there any limitations for svelte-expert-pro?

Requires knowledge of Svelte and JavaScript. Focused on Svelte 5 and SvelteKit, may not be compatible with older versions.

How To Install

  1. 1. Open your terminal

    Open the terminal or command line in your project directory.

  2. 2. Run the install command

    Run: npx killer-skills add ceslep/inasistig/svelte-expert-pro. The CLI will automatically detect your IDE or AI agent and configure the skill.

  3. 3. Start using the skill

    The skill is now active. Your AI agent can use svelte-expert-pro immediately in the current project.

Related Skills

Looking for an alternative to svelte-expert-pro or another community skill for your workflow? Explore these related open-source skills.

View All

widget-generator

Logo of f
f

f.k.a. Awesome ChatGPT Prompts. Share, discover, and collect prompts from the community. Free and open source — self-host for your organization with complete privacy.

149.6k
0
AI

flags

Logo of vercel
vercel

flags is a Next.js feature management skill that enables developers to efficiently add or modify framework feature flags, streamlining React application development.

138.4k
0
Browser

zustand

Logo of lobehub
lobehub

The ultimate space for work and life — to find, build, and collaborate with agent teammates that grow with you. We are taking agent harness to the next level — enabling multi-agent collaboration, effortless agent team design, and introducing agents as the unit of work interaction.

72.8k
0
AI

data-fetching

Logo of lobehub
lobehub

The ultimate space for work and life — to find, build, and collaborate with agent teammates that grow with you. We are taking agent harness to the next level — enabling multi-agent collaboration, effortless agent team design, and introducing agents as the unit of work interaction.

72.8k
0
AI