308 件 ・ 関連度順
概要と使いどころ
Handoff text-spacing extractor SKILL — 從 canonical HTML/JSX/TSX inline style 盡量抽出字間距與空間細節（letterSpacing, gap, padding, margin, fontSize, lineHeight 等），並回補到 Design System/design_handoff/source/ui-design-tokens.json 的 handoffTextSpacingExtracted 區段。USE FOR: UI 對齊前先把參考圖 / handoff source 的 spacing recipe 轉成可重用 token；DO NOT USE FOR: 只有 runtime 截圖、沒有 source 設定，或純 CSS module / computed style 無法直接讀取的場景。
日本語の概要は準備中です。原文の説明を表示しています。
Improve layout, spacing, and visual rhythm. Fixes monotonous grids, inconsistent spacing, and weak visual hierarchy. Use when the user mentions layout feeling off, spacing issues, visual hierarchy, crowded UI, alignment problems, or wanting better composition.
日本語の概要は準備中です。原文の説明を表示しています。
Explain and configure individual spacing algorithms using student performance data and forgetting curves. Use when personalising retention schedules in adaptive learning platforms.
日本語の概要は準備中です。原文の説明を表示しています。
Explain and configure individual spacing algorithms using student performance data and forgetting curves. Use when personalising retention schedules in adaptive learning platforms.
日本語の概要は準備中です。原文の説明を表示しています。
Comprehensive UI design guidance based on Refactoring UI principles covering design personality, color theory, layout strategy, visual hierarchy, typography, spacing, mobile-first responsive design, and writing copy that doesn't read like AI wrote it. Use this skill whenever the user is creating new pages, building components, making design additions or changes, reviewing UI code, asking about design decisions (colors, fonts, spacing, layout), writing or editing interface copy, or discussing visual improvements. Trigger for any design-related conversation including "how should this look", "what color", "font size", "spacing", "layout", "responsive", "mobile", "this copy", "headline", "button text", "microcopy", or when reviewing/critiquing existing interfaces.
日本語の概要は準備中です。原文の説明を表示しています。
Improve layout, spacing, and visual rhythm. Fixes monotonous grids, inconsistent spacing, and weak visual hierarchy. Use when the user mentions layout feeling off, spacing issues, visual hierarchy, crowded UI, alignment problems, or wanting better composition.
日本語の概要は準備中です。原文の説明を表示しています。
Improve layout, spacing, and visual rhythm. Fixes monotonous grids, inconsistent spacing, and weak visual hierarchy. Use when the user mentions layout feeling off, spacing issues, visual hierarchy, crowded UI, alignment problems, or wanting better composition.
日本語の概要は準備中です。原文の説明を表示しています。
Improve layout, spacing, and visual rhythm. Fixes monotonous grids, inconsistent spacing, and weak visual hierarchy. Use when the user mentions layout feeling off, spacing issues, visual hierarchy, crowded UI, alignment problems, or wanting better composition.
日本語の概要は準備中です。原文の説明を表示しています。
Improve layout, spacing, and visual rhythm. Fixes monotonous grids, inconsistent spacing, and weak visual hierarchy. Use when the user mentions layout feeling off, spacing issues, visual hierarchy, crowded UI, alignment problems, or wanting better composition.
日本語の概要は準備中です。原文の説明を表示しています。
Improve layout, spacing, and visual rhythm. Fixes monotonous grids, inconsistent spacing, and weak visual hierarchy. Use when the user mentions layout feeling off, spacing issues, visual hierarchy, crowded UI, alignment problems, or wanting better composition.
日本語の概要は準備中です。原文の説明を表示しています。
Improve layout, spacing, and visual rhythm. Fixes monotonous grids, inconsistent spacing, and weak visual hierarchy. Use when the user mentions layout feeling off, spacing issues, visual hierarchy, crowded UI, alignment problems, or wanting better composition.
日本語の概要は準備中です。原文の説明を表示しています。
画面の余白、文字、角丸、影、動きを見直し、見た目と操作感を整えるスキル。ボタンやカードなどの細部を点検し、変更前後が分かる具体的な改善案を示します。
既存コードから色・文字・余白などの共通ルールを抽出し、デザインの仕様書とプレビューを作るスキル。画面の統一感を10項目で評価し、修正箇所も示します。
StripeやLinearなど54のサイトの配色・文字・余白を参考に、HTML/CSSのページを制作します。部品や画面幅に応じた表示も揃えるスキル。
Create a container-in-container layout system using nested frames. Use an outer centered container with visible vertical boundary lines and corner markers. Inside, place inner containers inset from the edges, each with its own background and rounded frame. Technique: outer container defines global bounds, inner containers use padding to create inset spacing, layered frames (border + background) to separate levels, and consistent spacing between outer frame and inner blocks.
日本語の概要は準備中です。原文の説明を表示しています。
Convert Markdown files to Word documents (.docx) with proper formatting, Chinese font support (FangSong for all text including headings), black font color, 1.5x line spacing, precise first-line indent (24pt), heading spacing after (1 line), no italic headings, and automatic superscript conversion for citation numbers. Use when converting .md files to .docx, creating Word documents from markdown, or when user mentions Word, DOCX, or document conversion. Requires pandoc.
日本語の概要は準備中です。原文の説明を表示しています。
Upgrade of chinese-ppt for Chinese Beamer decks (xelatex + ctex + fandol, CUFE template). Same 7-section outline and X→M→Y framework, but adds (a) mandatory 1.3 line-spacing + 3pt paragraph spacing, (b) overflow-prevention line budget + balanced split-frame rules, (c) prose rewrites that strip AI-ish "关键比较/理论映射" labels and redundant 章节括号注释, (d) stricter CJK-space + middle-dot rules, (e) retrofit workflow for existing chinese-ppt decks, (f) mandatory local linespread reset inside TikZ / table / fixed-geometry frames. Use for "做中文学术PPT 2 版"、"中文 Beamer 改进版"、"答辩 PPT chinese-ppt2"、"防越界 PPT"等请求。用户在 Overleaf 编译，只产出 .tex + figures/，不要附加 compile 脚本。
日本語の概要は準備中です。原文の説明を表示しています。
Define a responsive grid — columns, gutters, margins, and breakpoint behaviour. Use when establishing page structure. For the spacing scale inside components use `spacing-system`; for cross-device behaviour use `responsive-design`.
日本語の概要は準備中です。原文の説明を表示しています。
Apply the Law of Common Region — a shared container, background, or border groups elements regardless of spacing. Use when grouping must survive a tight layout. For grouping by spacing alone, use `law-of-proximity`.
日本語の概要は準備中です。原文の説明を表示しています。
Create a spacing scale from a base unit with rules for when each step applies. Use when standardising padding and margins. For page-level columns and gutters, use `layout-grid`.
日本語の概要は準備中です。原文の説明を表示しています。
Build and maintain a design system inside an Expo app - a reusable theme of design tokens (color, spacing, typography, radius, shadow, motion), reusable component structure with variant/size/state prop conventions, and rules for when to extract a repeated view into a shared component. Use when creating or organizing theme files and design tokens (theme.ts / theme/), extending an existing theme or styling library (NativeWind, Tamagui, Restyle, Unistyles) in its own idiom, standardizing styles so screens (including AI-generated ones) look consistent and polished, fixing an app that looks AI-generated or generic instead of native (the named native-slop tells), building an in-app component library, or auditing an app for design-system drift (hardcoded colors, spacing, fonts). For platform styling specifics (semantic colors, HIG rules, native controls) use expo-native-ui; for folder layout of a new app use expo-project-structure.
日本語の概要は準備中です。原文の説明を表示しています。
Audit and fix visual hierarchy, spacing, color, and depth in web UIs. Use when the user mentions "my UI looks off" (or amateur/unprofessional), "fix the design", "Tailwind styling", "color palette", "visual hierarchy", "design system", "spacing scale", or "component styling". Also trigger when building consistent design tokens, creating dark mode themes, improving data-visualization clarity, or polishing UI details before launch. Covers grayscale-first workflow, constrained design scales, shadows, and component styling. For typeface selection, see web-typography. For usability audits, see ux-heuristics.
日本語の概要は準備中です。原文の説明を表示しています。
Generate, extend, or audit design tokens in DTCG format with the 3-tier architecture (primitive → semantic → component). Use when the user wants a color palette, type scale, spacing/shadow/radius/motion tokens, multi-brand theming, or wants to validate token files. Covers colors, typography, spacing, shadows, borders, breakpoints, motion, gradients, opacity, blur, sizing, states, theming.
日本語の概要は準備中です。原文の説明を表示しています。
When the user wants to define, audit, or apply visual identity (typography, colors, spacing, design tokens, frontend aesthetics). Also use when the user mentions "brand style guide," "visual identity," "design system," "typography," "color palette," "brand guidelines," "AI brand aesthetics," "brand colors," "font choices," "spacing system," "design tokens," "motion," "distinctive design," "frontend aesthetics," "PowerPoint theme," "Google Slides brand," or "slide master colors." For brand story, positioning, and voice, use branding.
日本語の概要は準備中です。原文の説明を表示しています。