Home Generate Challenge

Menu

Home Generate Challenge

Loading

JD&Co. (Website of the Day) — UI design breakdown

We overhauled JD&Coâ€™s brand to portray them as the industry leaders they are, and to match up their online presence to how they are as people and as a company. Sourced from CSS Design Awards. Use this page as a UI breakdown: reverse-engineer hierarchy, color roles, and interaction cues before you remix ideas into your own screens.

Study how JD&Co. separates primary actions from secondary content—note spacing, type scale, and focal contrast. Recognized as Website of the Day.
Screenshot the hero and a dense content section side by side to compare rhythm and density.
Ask: what would break first if this layout were a product dashboard—navigation clarity, scan order, or color contrast?
Related themes: minimal, grid, responsive, services.

Analyze your UI with AI feedback
Generate a UI practice challenge
Browse UI color palettes
Browse Google Font pairings
More award-winning website designs

JD&Co. award-winning website design screenshot 1

JD&Co. award-winning website design screenshot 2

JD&Co. award-winning website design screenshot 3

JD&Co. award-winning website design screenshot 4

JD&Co. award-winning website design screenshot 5

JD&Co.

SOTD

CSS Design Awards

We overhauled JD&Coâ€™s brand to portray them as the industry leaders they are, and to match up their online presence to how they are as people and as a company.