869 件 ・ 関連度順
概要と使いどころ
Use when reviewing stylesheets, component styles, and responsive behavior related to Order CSS files correctly. Check the rendered layout across breakpoints and interaction states before proposing a fix.
日本語の概要は準備中です。原文の説明を表示しています。
Style Remotion Studio UI inside `.css-reset` containers without relying on inherited reset properties.
日本語の概要は準備中です。原文の説明を表示しています。
Tailwind CSS v4 principles. CSS-first configuration, container queries, modern patterns, design token architecture.
日本語の概要は準備中です。原文の説明を表示しています。
Captures the user's brand identity once via a 10-question onboarding wizard (primary/accent HEX + heading + body Google Fonts + design style editorial/technical/minimal/playful + default output directory + syntax theme + TOC behavior + optional logo/company), validates body-text and link contrast against WCAG 2.2 AA, derives 12 CSS custom properties in HSL space, and stores the result for every markdown-html converter to consume. Use before any markdown-html conversion. Triggers on first-run onboarding ("set up the brand", "configure markdown-html", "run onboarding"), on explicit reset ("reset the design system", "re-onboard"), and is checked by every converter via config_loader.py before rendering. Refuses to save if body-text contrast fails AA 4.5:1 or the output dir isn't writable. Precedence is project (./.markdown-html/) > global (~/.config/markdown-html/) > built-in defaults; MARKDOWN_HTML_NO_CONFIG=1 bypasses.
日本語の概要は準備中です。原文の説明を表示しています。
CSS expert for flexbox, grid, animations, responsive design, and modern layout techniques
日本語の概要は準備中です。原文の説明を表示しています。
Safely append CSS styles from one file to another, with per-selector grep verification after every append to catch silent truncation that tail or wc-l alone would miss
日本語の概要は準備中です。原文の説明を表示しています。
CSS grid layout system for a responsive panel dashboard with dark theme. Uses CSS custom properties, auto-fill grid, and monospace font aesthetic inspired by worldmonitor.
日本語の概要は準備中です。原文の説明を表示しています。
Set up Tailwind CSS v4 in Expo with react-native-css and NativeWind v5 for universal styling
日本語の概要は準備中です。原文の説明を表示しています。
Use when designing/implementing UI with Tailwind CSS (layout, typography, responsive, theming, component patterns). Includes quick recipes and conventions for clean, consistent web design.
日本語の概要は準備中です。原文の説明を表示しています。
Validates animation durations, enforces typography scale, checks component accessibility, and prevents layout anti-patterns in Tailwind CSS projects. Use when building UI components, reviewing CSS utilities, styling React views, or enforcing design consistency.
日本語の概要は準備中です。原文の説明を表示しています。
Hunt client-side DOM vulnerabilities — DOM Clobbering (overwrite JS globals via HTML injection), PostMessage hijacking (missing origin check), Service Worker abuse (intercept requests from same-origin script), CSS Injection/Exfiltration (attribute selectors → token char-by-char via OOB), client-side template injection, dangerouslySetInnerHTML. Grounded in named public research: Gareth Heyes / PortSwigger DOM-clobbering + DOM-Invader, Michał Bentkowski DOMPurify clobbering bypasses, jQuery htmlPrefilter XSS (CVE-2020-11022 / CVE-2020-11023), d0nut CSS-exfil research. Use when hunting DOM-XSS, client-side auth bypass, or token exfiltration without server-side interaction.
日本語の概要は準備中です。原文の説明を表示しています。
Set up Tailwind CSS v4 in Expo with react-native-css and NativeWind v5 for universal styling
日本語の概要は準備中です。原文の説明を表示しています。
Adjust the user's Obsidian visual layout with CSS snippets. Use for restyling tabs, sidebars, note surfaces, properties, backlinks, graph or file-explorer UI, or diagnosing CSS changes that did not take effect.
日本語の概要は準備中です。原文の説明を表示しています。
Generate production-ready, accessible, token-driven component code for ANY framework — React+Tailwind, Next.js, SwiftUI, Vue, Svelte, Angular, Solid, Web Components/Lit, React Native, Flutter, Jetpack Compose, vanilla CSS, or CSS-in-JS. Use when the user wants working UI code for a component or screen in a specific stack.
日本語の概要は準備中です。原文の説明を表示しています。
Render a static iOS QWERTY keyboard as inline HTML+CSS sized for the 750-wide 9:16 stage. Includes the 3-suggestion bar, alpha keys, shift/backspace, 123/emoji/space/return row, and the bottom globe+mic strip. No animation logic — slide up/down is the molecule's job (CSS transform on the .keyboard root).
日本語の概要は準備中です。原文の説明を表示しています。
Set up Tailwind v4 + shadcn/ui themed UI with dark mode. Install deps, configure CSS variables via @theme inline, wire dark mode toggle, verify. Use whenever the user mentions Tailwind v4, setting up Tailwind theming, shadcn/ui colours, dark mode, or troubleshooting colours not working, tw-animate-css errors, @theme inline conflicts, @apply breaking after upgrade, or v3 → v4 migration issues.
日本語の概要は準備中です。原文の説明を表示しています。
Design tokens, light/dark theming, and WCAG contrast validation for HTML documents and decks, compiled into one inlinable CSS bundle. Use when theming a report or deck, auditing contrast, or fixing dark-mode color drift.
日本語の概要は準備中です。原文の説明を表示しています。
Tailwind CSS v4 principles. CSS-first configuration, container queries, modern patterns, design token architecture. Use when building with Tailwind v4 or migrating from v3.
日本語の概要は準備中です。原文の説明を表示しています。
Implement zero-runtime CSS with Tailwind, CSS Modules, and the cn() utility for RSC-compatible styling in Next.js. Use when choosing a styling library, creating dynamic class utilities, or optimizing fonts with next/font.
日本語の概要は準備中です。原文の説明を表示しています。
Provides design token system and theming framework for consistent, customizable UI styling across all components. Covers complete token taxonomy (color, typography, spacing, shadows, borders, motion, z-index), theme switching (CSS custom properties, theme providers), RTL/i18n support (CSS logical properties), and accessibility (WCAG contrast, high contrast themes, reduced motion). This is the foundational styling layer referenced by ALL component skills. Use when theming components, implementing light/dark mode, creating brand styles, customizing visual design, ensuring design consistency, or supporting RTL languages.
日本語の概要は準備中です。原文の説明を表示しています。
使用 Vite + React + TailwindCSS v4 + lucide-react 进行前端项目搭建和开发的技能。当用户需要创建前端项目、搭建 React 开发环境、使用 TailwindCSS 进行样式开发时使用此技能。
日本語の概要は準備中です。原文の説明を表示しています。
Zero-dependency animations and visual techniques - scroll-driven, View Transitions, @starting-style, modern CSS.
日本語の概要は準備中です。原文の説明を表示しています。
This skill should be used when creating new styled components or adding new CSS classes. Triggers on "create component", "new button", "new card", "add styles", "style component", "build UI element". Guides semantic naming, Tailwind composition, dark mode support, and test coverage.
日本語の概要は準備中です。原文の説明を表示しています。
Quick reference for Tailwind CSS utility patterns, responsive design, and configuration. Triggers on: tailwind, utility classes, responsive design, tailwind config, dark mode css, tw classes.
日本語の概要は準備中です。原文の説明を表示しています。