dlang.org website design: fonts, colors and UI patterns

Design character

dlang.org is a classic language homepage: helpful, slightly old-web in structure, and honest about being a community/docs hub. A brick-red (#b03931) top bar and matching primary buttons anchor the brand. Below, light gray and white bands hold intro copy, a code sample card, sponsor logos, and practical News/Learn/Community/Documentation columns. It prioritizes clarity over fashion.

What should survive adaptation:

• Brick-red as the single strong accent
• Code sample adjacent to the pitch
• Logo/proof row for industry use
• Utility multi-column link sections

Foundations

Color

Measured:

• Accent: #b03931
• Primary text: #333333
• Secondary text: #999999

Surfaces are light gray hero band + white lower sections. Links inside body copy often pick up the red accent. Buttons: filled red primary, white secondary with gray border.

Typography

Declared families unknown. Body ~15px / 21px line-height weight 400. Headings jump to ~30px. The stack reads as a standard readable sans for docs/marketing hybrid pages.

Spacing and layout

Radius 4px on buttons/inputs. Home is vertically stacked sections with a two-column hero (copy + code). Lower content uses multi-column grids. Spec TOC page is denser documentation navigation on the same palette.

Visual language

• Flat surfaces, minimal shadow
• Simple bordered code card
• Corporate logo strip
• Sidebar-ish latest announcements cards on the home right column
• Red text links as the interactive cue

Components and states

• Top nav: red bar, white wordmark/links, search
• Primary button: solid red (“Download”, “Donate”)
• Secondary button: white outline
• Code panel: monospaced sample in a light card
• Content cards: announcements list with thumbnails
• Spec TOC: hierarchical documentation links

Practical guidance

Preserve

• One red accent + gray text system
• Code beside the value prop
• Straightforward sectioning for Learn/Docs/Community

Avoid

• Rewriting it as a dark neon devrel landing
• Dropping the code sample from the hero story
• Over-rounding everything into a consumer app look

Scope note

Home and language spec TOC (pins 6415, 6416). Declared fonts not available; system is desktop-viewport documented here.