svelte-ui

Provide SvelteKit 2 design-system patterns for data-viewer apps with theming.

32|5|Updated Nov 11, 2024

Search Tags:#theming #charts #svelte #design-system #sveltekit #ui-patterns #component-patterns

Ready to run

npx skills add https://github.com/thejaminator/latteries --skill svelte-ui

💬 Prompt for ChatGPT / Claude Chat▼

Please help me install this Agent Skill.
Skill: svelte-ui
Source: https://github.com/thejaminator/latteries/tree/main/.claude/skills/svelte-ui
Command: npx skills add https://github.com/thejaminator/latteries --skill svelte-ui

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

Build polished SvelteKit data-viewer apps quickly by applying a cohesive design system, theming, and component patterns derived from iterative feedback.

Core Features & Use Cases

Design System & Theming
Component Patterns
Human Preferences & Corrections
Charts & Data Viz

Quick Start

Install dependencies and begin prototyping a SvelteKit UI using the included design-system patterns and references.

Frequently Asked Questions about svelte-ui

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

FAQPage Schema

How do I build a SvelteKit data-viewer app with a cohesive design system?▼

To build a SvelteKit data-viewer app, apply project-agnostic component patterns and theming references. This Skill provides design-system implementation guidance using CSS custom properties and TypeScript for SvelteKit 2.

Can I use CSS custom properties for theming in SvelteKit 2?▼

Yes, CSS custom properties for themes are explicitly supported for theming in SvelteKit 2. The Skill provides references for implementing a cohesive design system using this approach alongside TypeScript.

What's the best way to add charts and data visualization to a SvelteKit dashboard?▼

The best way to add charts to a SvelteKit dashboard is using the included data visualization patterns. The Skill covers charts and data viz specifically for data-viewer apps and dashboards.

Does this SvelteKit UI pattern collection support Markdown and LaTeX rendering?▼

Yes, a Markdown and LaTeX rendering workflow is supported. The Skill includes references for this workflow as part of building polished SvelteKit data-viewer applications.

Do I need TypeScript to use these SvelteKit component patterns?▼

TypeScript is required to satisfy the design-system implementation requirements. The component patterns and theming references are built for SvelteKit 2 with TypeScript.

Are these SvelteKit UI patterns project-specific or can I reuse them across apps?▼

These SvelteKit UI patterns are project-agnostic. They are derived from iterative feedback and designed for reuse across data-viewer apps and dashboards with cohesive theming.