Design Tools skills

12 skills

Generates production-ready React components using TypeScript, Tailwind CSS, and Zustand state management following industry best practices.

Transforms UI design screenshots into production-ready React components with TypeScript and Tailwind CSS.

Provides comprehensive implementation guidance for Bootstrap 5.3 helper classes to solve common layout, styling, and accessibility challenges.

Provides comprehensive guidance and implementation patterns for Bootstrap 5.3 utility classes to manage layout, spacing, and visual styling.

Integrates the official Bootstrap Icons library using various implementation methods, styling techniques, and accessibility standards.

Provides comprehensive guidance and code patterns for styling typography, images, tables, and core content elements using Bootstrap 5.3.

Streamlines the implementation and troubleshooting of Bootstrap 5.3.8 UI components with expert guidance on styling, behavior, and accessibility.

Tailors Bootstrap 5.3 interfaces using Sass variable overrides, CSS custom properties, and advanced color mode configurations.

Builds accessible, customizable UI components for Svelte and SvelteKit applications using shadcn-svelte and Tailwind CSS v4.1.

Extracts official brand color palettes from websites and design systems to automatically generate comprehensive VS Code theme configuration files.

Generates React components and Tailwind CSS code from text descriptions or UI screenshots using Gemini's multimodal capabilities.

Guides the development of consistent and performant web applications using SvelteKit 2, Svelte 5, and Tailwind CSS 4.