skills.rest
thejaminator
thejaminatorCOMMUNITY
Explore all skills by this author →
GitHub

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
One-click install
npx skills add https://github.com/thejaminator/latteries --skill svelte-ui
Or copy as Structured Prompt for Agent▼
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.

Related Skills

Explore More Design & Creative Skills→
digital-stoic-orgdigital-stoic-org
19

install-dependency

Automate monorepo-aware dependency installation across Python, JavaScript, and system packages.

Official
Intermediate
ArroganceGArroganceG

frontend-design

Create production-grade frontend interfaces with HTML, CSS, and JavaScript.

Community
Advanced
Jicate-SolutionsJicate-Solutions

api-integration

Automate child app integration with the MyJKKN parent app API.

Official
Advanced
curiositechcuriositech
181

frontend-architect

Recommend frontend stacks and Cloudflare deployment patterns for web applications.

Official
Advanced