本文へ移動
cccskills

スキルを探す

7,323 件 ・ 人気順

Settings for experts who are not developers — domain language, sane defaults, grouping by professional concept. Use when designing settings panels, solver configuration or constraint editors.

日本語の概要は準備中です。原文の説明を表示しています。

dembrandt/dembrandt-skills1362026年10月15日 更新

Rebuild a live web page 1:1 from measurement into Figma, Penpot or code, then verify it. Use when reproducing a page or checking a rebuild against the original.

日本語の概要は準備中です。原文の説明を表示しています。

dembrandt/dembrandt-skills1362026年10月15日 更新

Derive a full UI palette from one or two brand colours — state variants, brand-tinted greys, semantic colours. Use when building or expanding a colour system.

日本語の概要は準備中です。原文の説明を表示しています。

dembrandt/dembrandt-skills1362026年10月15日 更新

Rest, hover, active, focus, disabled and loading states, derived from the base colour. Use when designing buttons, links, inputs or any clickable component.

日本語の概要は準備中です。原文の説明を表示しています。

dembrandt/dembrandt-skills1362026年10月15日 更新

Mobile, tablet and desktop are different paradigms, not one layout scaled. Use when designing responsive layouts or deciding what each breakpoint shows.

日本語の概要は準備中です。原文の説明を表示しています。

dembrandt/dembrandt-skills1362026年10月15日 更新

Cards, drawers, carousels and other patterns borrowed from the physical world. Use when designing layout patterns, gestures or navigation paradigms.

日本語の概要は準備中です。原文の説明を表示しています。

dembrandt/dembrandt-skills1362026年10月15日 更新

Toasts, inline errors, banners and recovery paths. Use when designing error states, success confirmations, async feedback or in-place editing.

日本語の概要は準備中です。原文の説明を表示しています。

dembrandt/dembrandt-skills1362026年10月15日 更新

Ratio-based type scale where every size relates to the others. Use when defining font sizes or type tokens, or when typography feels arbitrary.

日本語の概要は準備中です。原文の説明を表示しています。

dembrandt/dembrandt-skills1362026年10月15日 更新

app-shell

無料

Top bar, sidebar rail, app launcher, tenant and environment cue, status bar. Use when designing the persistent shell, a collapsible sidebar, or navigation between apps behind one login.

日本語の概要は準備中です。原文の説明を表示しています。

dembrandt/dembrandt-skills1362026年10月15日 更新

Small purposeful animations — toggles, animated icons, success moments. Use when designing interactive feedback, success states or loaders.

日本語の概要は準備中です。原文の説明を表示しています。

dembrandt/dembrandt-skills1362026年10月15日 更新

Dense, linear, status-at-a-glance UI for specialists who use a tool all day. Use when designing dispatch, warehouse, logistics, scheduling or other B2B operations tools.

日本語の概要は準備中です。原文の説明を表示しています。

dembrandt/dembrandt-skills1362026年10月15日 更新

Currency, language, region and unit selectors live in a low-profile header or footer spot. Use when designing locale switchers or product-wide preference controls.

日本語の概要は準備中です。原文の説明を表示しています。

dembrandt/dembrandt-skills1362026年10月15日 更新

Few semantic colours, each meaning one thing, and errors with a way forward. Use when designing status indicators, validation, alerts or error states.

日本語の概要は準備中です。原文の説明を表示しています。

dembrandt/dembrandt-skills1362026年10月15日 更新

Helper text, placeholders, validation and submit behaviour. Use when designing or reviewing a form, input field or data entry UI.

日本語の概要は準備中です。原文の説明を表示しています。

dembrandt/dembrandt-skills1362026年10月15日 更新

Shape language across type, radius and icons carries brand personality. Use when starting a design system, picking icons or radius tokens, or reviewing visual consistency.

日本語の概要は準備中です。原文の説明を表示しています。

dembrandt/dembrandt-skills1362026年10月15日 更新

Group controls with Gestalt principles so users see what belongs together. Use when laying out components, navigation, toolbars, forms or dashboards.

日本語の概要は準備中です。原文の説明を表示しています。

dembrandt/dembrandt-skills1362026年10月15日 更新

Shadows and layering that lift elements above the surface. Use when designing cards, dropdowns, modals, tooltips or any floating element.

日本語の概要は準備中です。原文の説明を表示しています。

dembrandt/dembrandt-skills1362026年10月15日 更新

WCAG 2.2 AA compliance as required by the European Accessibility Act. Use when designing, building or reviewing any user-facing interface for accessibility.

日本語の概要は準備中です。原文の説明を表示しています。

dembrandt/dembrandt-skills1362026年10月15日 更新

Extract a design system from a screenshot (PNG/JPG/WEBP) or a live URL and produce a schema-compliant `design.v1.json` file plus a ready-to-use agent prompt for applying the design to any website/app. When run inside the sleek-ui repository, offers to add the extracted design to the public catalog as a PR — updating `public/designs/`, `src/data/designs/`, `src/data/designs.ts`, and generating a preview. Use when users ask to "extract a design from this screenshot", "clone this site's design", "reverse-engineer the design tokens", "reskin my app to look like {site}", "generate a sleek-ui design from this URL", or provide an image/URL and want a reusable design system.

日本語の概要は準備中です。原文の説明を表示しています。

luongnv89/sleek-ui1352026年10月16日 更新

oa-design

無料

Open Analytics' design language, extracted from the shipped product: an ink-derived neutral system, squircle surface anatomy, one small spring vocabulary, pixel-matched skeletons, and a plain-spoken copy voice, with type-checked component recipes. Use this whenever you build or restyle a dashboard, SaaS app, analytics UI, settings screen, onboarding flow, or marketing/landing page that should feel calm, dense and native, and whenever the user mentions Open Analytics' look, 'clean SaaS design', cards, dropdowns, tab bars, empty states, skeletons, or UI animation quality, even if they never say the words 'design system'.

日本語の概要は準備中です。原文の説明を表示しています。

OpenLabs-so/oa-design1342026年8月21日 更新

Review website/app UX for humans and AX for AI/search; produce an evidence-backed audit and improvement plan across usability, brand, access, speed, conversion and discoverability. Don't use for UI builds, SEO-only edits, or legal certification.

日本語の概要は準備中です。原文の説明を表示しています。

luongnv89/skills1332026年10月21日 更新

Generate a Technical Architecture Document (TAD) from a PRD. Use when asked to design system architecture or define how a product is built. Updates tad.md and reports GitHub links. Don't use for PRD authoring, sprint tasks, or code implementation.

日本語の概要は準備中です。原文の説明を表示しています。

luongnv89/skills1332026年10月21日 更新

Optimize a website or app design in one run: capture the page once, audit usability, UX/AX, virality and agent readiness, merge overlaps into one prioritized report, apply fixes on opt-in. Don't use for one lens (dont-make-me-think, ux-ax-review).

日本語の概要は準備中です。原文の説明を表示しています。

luongnv89/skills1332026年10月21日 更新

Generate professional SVG logos from project context: 7 brand variants plus a showcase HTML page. Use for product marks, wordmarks, icons, and favicons. Don't use for raster-only logos, illustrations, or full brand guidelines.

日本語の概要は準備中です。原文の説明を表示しています。

luongnv89/skills1332026年10月21日 更新