Dembrandt
Official@dembrandt
Extract Design Systems Instantly From Any Url
Agent Skills by Dembrandt
Showing 40 vetted skills indexed across 1 GitHub repositories.
dembrandtnielsen-usability-heuristics
Evaluate interface usability against Nielsen's 10 usability heuristics.
dembrandtbrand-visual-language
Define cohesive border-radius, typography, and iconography systems for brand consistency.
dembrandtcoordinated-data-views
Synchronize selections and highlights across paired data tables and visual views.
dembrandtmicro-interactions
Design micro-interactions that confirm user actions and communicate state changes.
dembrandtgenerate-ui-from-brand
Convert a website URL or DESIGN.md into a brand-aligned UI specification with normalized design tokens.
dembrandtsemantic-html-and-seo
Apply semantic HTML and SEO metadata to web interfaces.
dembrandttab-navigation
Create accessible tabbed interfaces with ARIA semantics and keyboard navigation.
dembrandtform-design
Designs web forms with accessible labels, validation, and input types.
dembrandtscroll-areas
Review interface layouts for nested scrolling and overflow behavior.
dembrandtrepeated-component-alignment
Align repeated UI components with fixed slots and pinned anchors.
dembrandtsticky-and-fixed-elements
Choose sticky or fixed positioning for persistent interface elements with CSS.
dembrandtcomponent-family-consistency
Align UI component tokens, states, and interaction patterns across libraries.
dembrandtalgorithmic-color-palette
Generate CSS-ready color tokens and palettes from brand colors using HSL adjustments.
dembrandtdata-display-and-selection
Design interfaces for displaying, searching, selecting, and managing complex data collections.
dembrandtextract-design
ExtractUiTokensAndStylesheetFromWebsiteAndReturn in structured format, with Tailwind compatibility and customizable extraction.
dembrandtglobal-toolbar-controls
Place global preference selectors in low-profile header, footer, or settings locations.
dembrandtvisual-emphasis-and-hierarchy
Establish clear visual hierarchy for buttons, CTAs, and interface layouts.
dembrandtuser-flows-and-guided-paths
Design guided paths for sequential user journeys with staged validation.
dembrandtperformance-and-web-vitals
Audit Lighthouse scores and optimize Core Web Vitals for frontend applications.
dembrandtlayout-paradigms-and-consistency
Select layout paradigms and define reusable page skeletons for application screens.
dembrandtui-density
Select UI density for platforms, user types, and primary tasks.
dembrandtmodal-and-overlay-patterns
Select accessible overlay patterns for modals, drawers, and menus.
dembrandtloading-states-and-perceived-performance
Designs user-centered loading strategies for mobile and web interfaces.
dembrandtgestalt-ui-organisation
Organize UI layouts and component groups using visual grouping principles.
Frequently Asked Questions About Dembrandt
FAQPage SchemaWhat specific tasks can I perform using Dembrandt's design extraction capabilities?▼
You can instantly extract UI tokens, stylesheets, and brand-aligned design specifications from any URL. This enables the rapid conversion of existing web interfaces into structured, Tailwind-compatible design systems, ensuring consistency across typography, color palettes, and component states.
Which personas benefit most from these interface design capabilities?▼
Frontend engineers, product designers, and design system architects benefit most. These capabilities are specifically tailored for teams managing complex, data-driven applications who need to maintain visual hierarchy, accessibility standards, and component consistency across large-scale product ecosystems.
What are the prerequisites for generating a UI specification from a website?▼
The primary prerequisite is a valid, publicly accessible URL or a structured DESIGN.md file. Once provided, the system analyzes the interface to generate normalized design tokens, semantic HTML structures, and responsive layout paradigms based on the existing visual language.