Dia

A browser you won't dread opening.

Download ↓
▶Watch the scream
The browser for your best work

Dia reads between the tabs

Answers without asking

Dia already has the context of every tab you have open, so you skip the copy-paste.

Ready-to-share outputs

Ask for a deck and your research turns into something actually presentable.

Stay focused

Block trackers, mute the noise and keep the work day moving.

Privacy · This session
Block trackersOn
Third-party cookiesBlocked
History syncLocal
Model contextOn-device
Tabs · Reports · Skills · History · Tabs · Reports · Skills · History · Tabs · Reports · Skills · History
Controls

Pills, chips, translucency

White pill Dark pill Chip Secondary chip Disabled Lime mark Yellow mark
Video overlay pill Video overlay pill ← over the stage (last is hover)
White pill Dark pill Chip Secondary chip ← hover (0.2s)
Search or ask anything Focused input Focused chip ← recommended focus ring (site defines none)

Controls fill with translucent rgba(235,235,235,.7) rather than solid grey, at 20px radius and 35px tall; pills are 9999px at 50–56px. Over video, chrome becomes a rgba(0,0,0,.65) pill with backdrop blur(12px). The real site defines no focus ring and no reduced-motion block — both shown here as recommended additions, not captured tokens.

Typography

One serif, two weights apart

Wordmark · Exposure Variable · 112/95.2 · 300 · -3.36pxDia
Section (h2) · Exposure VAR · 48/56 · 650 · -2.4pxReads between the tabs
Hero body · ABC Oracle · 24/32 · 400 · normalA browser you won't dread opening.
Sub / lead (h3) · ABC Oracle · 18/27 · 400 · -0.36pxAsk Dia for a deck and your research shows up.
Nav · ABC Oracle · 16/20 · 400 · normalWhat's New · Security · Reports
Control label · ABC Oracle Triple · 16 · 400 · normalBlock trackers   On
Palette

Alpha ink on near-white

Stage & surfaces
stage#020204
black#000000
canvas#f8f8f8
white#ffffff
grey-fill#efefef
translucent-grey#ebebeb b3
tint#000000 0a
Alpha ink ladder & borders
ink#000000 d9
ink-60#000000 99
ink-45#000000 73
ink-42#000000 6c
ink-20#000000 33
on-dark#ffffff d9
hairline#000000 0f
hairline-2#000000 14
Highlighter accents & chroma sweep
lime#f2fcb3
yellow#ffdc5c
chroma orchid#c679c4
chroma red#fa3d1d
chroma amber#ffb005
Depth and motion

Blur, not shadow

12px
12px top
14px
16px
20px panel
24px
30px
9999px pill
1px rgba(0,0,0,.06)
translucent fill
backdrop blur(24px)
backdrop blur(12px)

There are effectively zero shadows — the only box-shadow is a transparent placeholder. Depth is translucent fills plus backdrop blur(24px) and blur(12px). Motion is 0.2s cubic-bezier(.4,0,.2,1) across 13 keyframes in two groups: marquees (marqueeL/R/U/D, diaMarqueeL/R) and the signature chroma family (chroma-sweep, chroma-expand-bidirectional, border-gradient-sweep, fade-to-black-sweep) that animates the rainbow ramp across text and borders.