Restyle the docs in scroll.io's landing page brand

[zzq0826]

Summary

Brings docs.scroll.io in line with the new scroll.io landing page (frontends/design/landing.html) and the blog built on it: fonts, logo, colours and every component that carried the old orange/cream look.

Tokens

• New src/styles/brand.css holds the landing page's system: warm ground #F4F2F0, ink #0A0A0A with a four-step ramp, hairlines, and one violet accent #6D45E8.
• Tailwind colours and the old design-system / --theme-* variables now point at these tokens, so a colour change lives in one file.
• The landing page is light only. The docs keep their theme toggle, so each token also has a dark value under .dark.

Type

• Instrument Serif for display and h1/h2, Inter for running text, JetBrains Mono for code and small labels.
• Replaces TransSans, Roboto and the circular face that loaded from Chainlink's CDN.

Logo and icons

• The new Scroll mark with the word "Scroll" and a "Docs" pill. The mark is drawn in currentColor, so it follows the theme.
• Favicon copied from frontends; the 32px and apple-touch PNGs are rendered from the mark.

Components

• Header: frosted bar, and a hairline under the nav link on hover and under the current section.
• Left sidebar: mono group labels, current page on a soft violet pill.
• Table of contents: the blog's rail.
• Content: callouts tinted per type, 12px tables, blockquotes with a left hairline, underlined violet links.
• Code blocks: light and dark Expressive Code themes (github-light / github-dark with brand backgrounds), switched by the .dark class.
• Also restyled: tabs, toggles, buttons, footer (landing's plain footer), newsletter band, home page (serif hero, white lift cards), 404, and the Ask AI / Copy page control.

Fixes and removals

• Dark mode: the RPC table's text is readable (the package forces color: black), and the Note/SDK/next icons no longer have hard-coded fills.
• Removed the footer's Join Us and Brand Kit links: both return 404 on scroll.io now.

Notes

• CJK headings fall back to the system serif; Instrument Serif has no CJK glyphs.
• The old logo SVGs, GitHub icons and TransSans font files in public/ are no longer referenced. I left them in place in case anything links to them directly.
• Prettier (the lint-staged hook) also reformatted some existing lines in the touched files.

Test plan

• astro build passes (468 pages)
• Checked in Chrome in light and dark mode: home, a docs page, and article-components (every MDX component: code, callouts, tables, tabs, toggle, mermaid, markmap, RPC table)
• Checked at 390px: header fits with the menu button visible, mobile menu and search open correctly
• Localized home pages (zh/es/tr) share the same layout
• Review on the Vercel preview

🤖 Generated with Claude Code

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated
scroll-documentation	Ready	Preview	Sep 24, 2026 6:53am UTC