D.
Dutchy
Layout

Patterns

Pre-built layout patterns for common UI sections. Hero areas, navigation bars, footers, and grid layouts with the Dutchy aesthetic.

Hero Sections

Bold opening sections that set the tone. Various layouts for different content needs.

Split Layout

Featured

Hero
Headline.

Supporting text that provides context and encourages action.

50+

Components

Centered Layout

Announcement

Centered Hero Layout

Perfect for landing pages where the message is the focus.

With Stats Grid

Bold Numbers Speak

Let your metrics make the impact.

50+

Components

6

Categories

100%

Accessible

MIT

Licensed

Navigation

Header and navigation patterns with the bold Dutchy style.

Breadcrumbs

Grid Layouts

Structured grid patterns for organizing content with tight gaps and clear boundaries.

Tight Grid (0.5 Gap)

Item 1

Grid Item

Item 2

Grid Item

Item 3

Grid Item

Item 4

Grid Item

Feature Grid

Feature One

Description of the first feature with supporting details.

Feature Two

Description of the second feature with supporting details.

Feature Three

Description of the third feature with supporting details.

Asymmetric Layout

Main Content Area

Larger area for primary content or featured items.

Sidebar

Secondary content or CTA.

Footers

Footer patterns for closing out pages with navigation and brand reinforcement.

Call to Action

Conversion-focused sections to drive user action.

Ready to Get Started?

Join thousands already using Dutchy to build bold interfaces.