Google Bug Hunters

Clinical developer aesthetic with dark charcoal surfaces, clean sans-serif type, and terminal-inspired monospace accents. Wireframe vector illustrations reinforce technical precision.

clinical

Visit site

Colour

Background#202124

Text#ffffff

Accent#ffffff

Surface#191919

Muted#ffffff

Typefaces

Display: Google Sans
Body: Google Sans
Mono: Roboto Mono
Source: google
Scale: 14 · 16 · 18 · 20 · 32 · 44

Layout

Grid: —
Container: —
Spacing base: 4px
Radius: 0px

Capture

Category: tools
Sections: 4
Captured: 2026-08-30
Rhythm: dark x4

Type rules

display headings set in Google Sans sentence case
section eyebrows and code comments in uppercase Roboto Mono
body measure constrained to approximately 70 characters

Colour rules

uniform dark charcoal background across all sections
high-contrast white borders for interactive containers and CTAs

Voice rules

use developer-oriented terminology
explicit numbered steps for processes

Holds it together

render eyebrows with monospace syntax comments and numbered indices
enclose primary actions in stark 1px white rectangular borders
use geometric wireframes on dark surfaces for visual assets

Contrast

text on background16.1:1 AAA

muted text on background16.1:1 AAA

text on surface17.6:1 AAA

accent on background16.1:1 AAA

background on accent16.1:1 AAA

Type, measured

Body: 16px / 1.75
Measure: 71 characters
Display: 60px / 1.17
Tracking: -0.013em display
Scale ratio: 1.39

Voice

Tone: instructive, direct
Sentences: medium
Person: second
Vocabulary: technical
Calls to action: report, review, explore, watch

Built with

Builder: —
Framework: —
Motion: —
WebGL: —
Nav: top_bar, 1 items
Length: 3.3 screens

Sections in page order

3 marked strong · 4

Rhythm — each block is a section, as wide as it is tall, in the colour it is on

00
hero
Strong
A dark, clinical developer portal hero pairing crisp geometric wireframe graphics with monospace code accents on charcoal.
Mood
clinical + raw
Layout
2 col · split · airy
Open section →
01
feature
Strong
A dark-mode technical overview section pairing descriptive body copy with stacked video feature cards for security researchers.
Mood
clinical + raw
Layout
2 col · split · balanced
Open section →
02
feature grid
Strong
A technical three-step cybersecurity workflow laid out across precise dark cards with subtle dot-matrix wireframe illustrations.
Mood
clinical + raw
Layout
3 col · grid · balanced
Open section →
03
feature
A stark dark-mode educational block balancing developer-focused monospace accents with clean sans-serif typography and generous negative space.
Mood
clinical + raw
Layout
1 col · split · airy
Open section →