dembrandt
44 skills with substantive source documentation and an official publisher or observed installation demand. Read each skill’s original documentation through its card.
dembrandtalgorithmic-color-palette
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.
- 安装量
- 2
- GitHub Stars
- 133
- 最近更新
- 10月15日
dembrandtapp-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.
- 安装量
- 2
- GitHub Stars
- 133
- 最近更新
- 10月15日
dembrandtauthentic-product-representation
Product visuals must show the real product with real data. Use when building landing pages, hero sections, screenshots or demo panels.
- 安装量
- 2
- GitHub Stars
- 133
- 最近更新
- 10月15日
dembrandtbrand-visual-language
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.
- 安装量
- 2
- GitHub Stars
- 133
- 最近更新
- 10月15日
dembrandtbutton-states
Rest, hover, active, focus, disabled and loading states, derived from the base colour. Use when designing buttons, links, inputs or any clickable component.
- 安装量
- 2
- GitHub Stars
- 133
- 最近更新
- 10月15日
dembrandtclone-website
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.
- 安装量
- 2
- GitHub Stars
- 133
- 最近更新
- 10月15日
dembrandtcolor-mode-and-theme
Light, dark or both, and when a theme selector is worth it. Use when defining a base palette or deciding on dark mode support.
- 安装量
- 2
- GitHub Stars
- 133
- 最近更新
- 10月15日
dembrandtcomponent-family-consistency
Buttons, inputs, badges and pills share radius, colour logic, shadow, border and spacing. Use when building or reviewing a component library.
- 安装量
- 2
- GitHub Stars
- 133
- 最近更新
- 10月15日
dembrandtcoordinated-data-views
Show a table and its map, diagram, timeline or chart together, with selection synced both ways. Use when data appears in two representations at once.
- 安装量
- 2
- GitHub Stars
- 133
- 最近更新
- 10月15日
dembrandtdata-display-and-selection
View modes, row selection, mass actions, sorting, filters, search and table patterns. Use when designing data tables, listings, file browsers or any collection.
- 安装量
- 2
- GitHub Stars
- 133
- 最近更新
- 10月15日
dembrandtdembrandt
Orchestrator that routes a UI/UX task through brand, tokens, layout, components, polish and accessibility. Use for multi-concern work such as a design review, UI build or interface audit.
- 安装量
- 2
- GitHub Stars
- 133
- 最近更新
- 10月15日
dembrandtdomain-expert-configuration
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.
- 安装量
- 2
- GitHub Stars
- 133
- 最近更新
- 10月15日
dembrandtelevation-and-depth
Shadows and layering that lift elements above the surface. Use when designing cards, dropdowns, modals, tooltips or any floating element.
- 安装量
- 2
- GitHub Stars
- 133
- 最近更新
- 10月15日
dembrandtform-design
Helper text, placeholders, validation and submit behaviour. Use when designing or reviewing a form, input field or data entry UI.
- 安装量
- 2
- GitHub Stars
- 133
- 最近更新
- 10月15日
dembrandtgenerate-ui-from-brand
Pipeline from a URL or DESIGN.md to tokens, decisions and a UI spec. Use when building UI for an existing brand, auditing a design system or fixing visual inconsistency.
- 安装量
- 2
- GitHub Stars
- 133
- 最近更新
- 10月15日
dembrandtgestalt-ui-organisation
Group controls with Gestalt principles so users see what belongs together. Use when laying out components, navigation, toolbars, forms or dashboards.
- 安装量
- 2
- GitHub Stars
- 133
- 最近更新
- 10月15日
dembrandtglobal-toolbar-controls
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.
- 安装量
- 2
- GitHub Stars
- 133
- 最近更新
- 10月15日
dembrandtinformation-architecture
Naming, navigation, a UI that mirrors the data model, confirms for irreversible changes. Use when structuring a large application or naming its entities.
- 安装量
- 2
- GitHub Stars
- 133
- 最近更新
- 10月15日
dembrandtlayout-paradigms-and-consistency
Choose a layout paradigm (feed, board, table, canvas, master-detail, dashboard) and reuse it across screens. Includes a landing page narrative framework. Use when structuring a screen, page template or landing page.
- 安装量
- 2
- GitHub Stars
- 133
- 最近更新
- 10月15日
dembrandtloading-states-and-perceived-performance
Spinners, skeletons and staggered reveals that manage wait times. Use when designing loading states, async data or the feel of a slow interface.
- 安装量
- 2
- GitHub Stars
- 133
- 最近更新
- 10月15日
dembrandtmarketing-vs-product-system
A marketing site and its product may differ in density and scale but share one token layer. Use when the two drift apart, share components or need a single token owner.
- 安装量
- 2
- GitHub Stars
- 133
- 最近更新
- 10月15日
dembrandtmicro-interactions
Small purposeful animations — toggles, animated icons, success moments. Use when designing interactive feedback, success states or loaders.
- 安装量
- 2
- GitHub Stars
- 133
- 最近更新
- 10月15日
dembrandtmodal-and-overlay-patterns
Modals, drawers, bottom sheets and popovers, each with its scope and blocking level. Use when designing dialogs, confirmations, side panels or action sheets.
- 安装量
- 2
- GitHub Stars
- 133
- 最近更新
- 10月15日
dembrandtmodular-scale-typography
Ratio-based type scale where every size relates to the others. Use when defining font sizes or type tokens, or when typography feels arbitrary.
- 安装量
- 2
- GitHub Stars
- 133
- 最近更新
- 10月15日