Redesign docs with canvas layout, new home page, and design-system icons by kgowru · Pull Request #7641 · fern-api/docs

kgowru · 2026-10-28T02:52:07Z

Brings buildwithfern.com/learn in line with the marketing site: GT Planar and Berkeley Mono fonts, marketing color tokens, a new footer, and a redesigned SDKs overview (carries the changes from #7273 and #7637). Switches the site to a full-width canvas layout with search and Ask AI at the canvas's left edge, no header or sidebar divider lines, the TOC pinned to the canvas's right edge, and changelog pages in the same card. Rebuilds the home page with a left-aligned hero, a grouped code explorer, a Connect your agent card, and product, API definition, and community sections, and fixes the home sidebar's CLI Generator link. Replaces Font Awesome icons in navigation and page content with SVGs exported from the Fern design system in sdk-gen-fern-platform (stored in fern/assets/icons), keeping Font Awesome only for brand logos the design system doesn't have.

🤖 Generated with Claude Code

Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

…mated side patterns Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

…on A arrows and add GitHub/X hover dots Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

… patterns; add Fern cutout trail field below footer Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

…der track Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

…brighter footer field; full-height nav line; hide duplicate Built with Fern Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

…ntil the user scrolls Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

…ions; tighten section header spacing Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

…rds; light CLI terminal in light mode Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

…tags on Version A Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

…rop section numbers Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

…me page frame Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

…eting-theme Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com> # Conflicts: # fern/products/sdks/introduction.mdx

Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

… and Version A Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

…h SDK, thin install command, drop logo row Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

… them Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

…verview prose Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

…pages Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

… spec icons Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

…s icons Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

…cs icons Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

…orted specs Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

Rebuild the home page with a left-aligned hero, grouped code explorer, and a Connect your agent card; replace the grid sections with product, API definition, and community sections. Move search and Ask AI to the left edge of the canvas, make the layout full width, drop the header and sidebar divider lines, and fix TOC and changelog placement inside the canvas. Co-Authored-By: Claude Opus 5.5 (1M context) <[email protected]>

Export the Fern design-system glyphs from sdk-gen-fern-platform as SVGs in fern/assets/icons and replace Font Awesome references in navigation and page content. Brand logos without a design-system equivalent stay on Font Awesome. Co-Authored-By: Claude Opus 5.5 (1M context) <[email protected]>

github-actions · 2026-10-28T02:52:58Z

+      path: ../sdks/rust
+```
+</ExplorerItem>
+<ExplorerItem group="Generate" label="CLI Generator" href="/learn/cli-generator/get-started/quickstart" options={["generators.yml"]}>


📝 [vale] <FernStyles.Headings> _{reported by reviewdog 🐶}
'CLI Generator' should use sentence-style capitalization.

github-actions · 2026-10-28T02:52:58Z

+    Client libraries in TypeScript, Python, Go, Java, C#, PHP, Ruby, Swift, and Rust
+  </Card>
+  <Card title="Docs" icon="/assets/icons/book-open.svg" href="/learn/docs/getting-started/capabilities">
+    Interactive API reference and guides, published from your repository


🚫 [vale] <FernStyles.Reject> _{reported by reviewdog 🐶}
Use 'API Reference' instead of 'API reference'.

github-actions · 2026-10-28T02:52:58Z


 <CardGroup cols={3}>
-  <Card title="Dependency Free" icon="fa-duotone fa-leaf" href="#dependency-free">
+  <Card title="Dependency Free" icon="/assets/icons/fern-agent.svg" href="#dependency-free">


📝 [vale] <FernStyles.Headings> _{reported by reviewdog 🐶}
'Dependency Free' should use sentence-style capitalization.

github-actions · 2026-10-28T02:52:58Z

  </Card>

-  <Card title="Strongly Typed" icon="fa-duotone fa-shield-check" href="#strongly-typed">
+  <Card title="Strongly Typed" icon="/assets/icons/shield-check.svg" href="#strongly-typed">


📝 [vale] <FernStyles.Headings> _{reported by reviewdog 🐶}
'Strongly Typed' should use sentence-style capitalization.

github-actions · 2026-10-28T02:52:58Z

  </Card>

-  <Card title="Full Spec Support" icon="fa-duotone fa-layer-group" href="#full-spec-support">
+  <Card title="Full Spec Support" icon="/assets/icons/layers.svg" href="#full-spec-support">


📝 [vale] <FernStyles.Headings> _{reported by reviewdog 🐶}
'Full Spec Support' should use sentence-style capitalization.

github-actions · 2026-10-28T02:52:58Z

+    </div>
+    <div className="group not-prose relative sdk-tile sdk-tile-request">
+      <div>
+        <p className="hg-tile-title hg-tile-title-sm">Need another language?</p>


📝 [vale] <Microsoft.QuestionMarks> _{reported by reviewdog 🐶}
Use questions sparingly.

github-actions · 2026-10-28T02:52:58Z

+    <div className="group not-prose relative sdk-tile sdk-tile-request">
+      <div>
+        <p className="hg-tile-title hg-tile-title-sm">Need another language?</p>
+        <p className="hg-tile-text">Tell us which language your users need and we'll prioritize it.</p>


📝 [vale] <FernStyles.We> _{reported by reviewdog 🐶}
Try to avoid using first-person plural like 'we'.

github-actions · 2026-10-28T02:52:58Z


 <CardGroup cols={3}>
-  <Card title="Dependency Free" icon="fa-duotone fa-leaf" href="#dependency-free">
+  <Card title="Dependency Free" icon="/assets/icons/fern-agent.svg" href="#dependency-free">


📝 [vale] <FernStyles.Headings> _{reported by reviewdog 🐶}
'Dependency Free' should use sentence-style capitalization.

github-actions · 2026-10-28T02:52:58Z

  </Card>

-  <Card title="Strongly Typed" icon="fa-duotone fa-shield-check" href="#strongly-typed">
+  <Card title="Strongly Typed" icon="/assets/icons/shield-check.svg" href="#strongly-typed">


📝 [vale] <FernStyles.Headings> _{reported by reviewdog 🐶}
'Strongly Typed' should use sentence-style capitalization.

github-actions · 2026-10-28T02:52:58Z

  </Card>

-  <Card title="Full Spec Support" icon="fa-duotone fa-layer-group" href="#full-spec-support">
+  <Card title="Full Spec Support" icon="/assets/icons/layers.svg" href="#full-spec-support">


📝 [vale] <FernStyles.Headings> _{reported by reviewdog 🐶}
'Full Spec Support' should use sentence-style capitalization.

github-actions · 2026-10-28T02:54:31Z

🌿 Preview your docs: https://fern-preview-kgowru-redesign-canvas-layout.docs.buildwithfern.com/learn

Here are the markdown pages you've updated:

kgowru and others added 30 commits October 6, 2026 03:04

Match docs theme to buildwithfern.com design tokens

9b70dde

Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

Add two home page versions with marketing grid, hover effects and ani…

bb397dd

…mated side patterns Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

Hide neighbor rest dots on shared corners while a tile is hovered

71f85f3

Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

Track tile hover at the document level so it survives MDX re-renders

569eb18

Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

Use grayscale buildwithfern.com/cli terminal in Version B; drop Versi…

b9ee272

…on A arrows and add GitHub/X hover dots Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

Version A: header-width layout with sticky section quick nav, no side…

0259308

… patterns; add Fern cutout trail field below footer Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

Quick nav: track active section by header offset only

f30ccae

Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

Quick nav: drop section numbers, Overview link and logo; add left bor…

bb10859

…der track Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

Version A: CLI tile with draw-in terminal, Ask Fern link; full-bleed …

03bab57

…brighter footer field; full-height nav line; hide duplicate Built with Fern Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

Hide the default Built with Fern badge on the production renderer

857a5fc

Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

Quick nav: hold the clicked section while smooth-scrolling

1cd0c69

Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

CLI tile: match trace to border color and keep terminal height fixed

08f821c

Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

Footer: strengthen the highlight on dots near the Fern wordmark

5a03d8e

Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

Quick nav: align first link with the first section heading

100691d

Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

Quick nav: re-align after fonts load

02a622c

Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

Quick nav: measure from the sticky column and hold the clicked item u…

9e45d36

…ntil the user scrolls Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

Footer: fix highlight color parsing so dots near the wordmark are lit

1ad69d1

Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

Home variants: replace SDK and Docs Rive graphics with draw-in animat…

26433a2

…ions; tighten section header spacing Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

Docs graphic: keep sidebar highlight in sync with the page title

4e46c0c

Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

SDKs overview: language cards in the home grid style

ff02536

Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

SDKs overview: show one card image per theme, hide external-link icons

3b57f9c

Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

Home variants: rebuild SDK and Docs graphics to match the Rive artboa…

b6acfe1

…rds; light CLI terminal in light mode Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

SDK/Docs graphics: regular weight text, brighter dark hero

0ef7e8b

Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

Docs graphic: keep the window border, fade only the page body

4ce6110

Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

Quick nav: keep space below the sticky links at the end of the page

cc2e564

Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

SDKs page: wider overview layout, unclipped corner dots; add section …

ef4bea6

…tags on Version A Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

Version A: section numbers in the gutter, numbered quick nav links

521b363

Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

Version A: section and quick nav numbers at font-weight 100

84ca5a2

Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

Sidebar: add left border on desktop

cf3a84d

Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

Sidebar: move left border to the sidebar column

130f54b

Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

kgowru and others added 26 commits October 14, 2026 21:24

Version A: move quick nav to the right as an 'On this page' TOC and d…

a79af77

…rop section numbers Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

Line the docs sidebar's left border up with the logo, matching the ho…

e400b87

…me page frame Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

Version A: right-align the On this page TOC to the header's right edge

b13959c

Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

Merge remote-tracking branch 'origin/main' into devin/1791255002-mark…

c5d9ff8

…eting-theme Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com> # Conflicts: # fern/products/sdks/introduction.mdx

SDKs overview: point OAuth card at the legacy generators.yml reference

2820dc1

Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

Full-height divider lines on both sides of the TOC column, docs pages…

5e13501

… and Version A Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

Version A: use the built-in overview layout TOC; SDK tabs link to eac…

a73a458

…h SDK, thin install command, drop logo row Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

Version A: tile titles as markdown headings so the built-in TOC lists…

9a0e948

… them Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

Version A: keep minimal tile buttons in the foreground color inside o…

9ee8487

…verview prose Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

Home: make the grid design the default home page; remove Version A/B …

af2b19c

…pages Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

Home: left frame line under the logo; grid fills the width up to the TOC

588f3d9

Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

Home: align left frame with the header logo on wide screens

ca89d03

Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

Home: active title, hide page actions, show frame-edge grid dots

59d7f92

Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

Home: lighter title, drop subtitle

7a6d143

Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

Docs: 400 page titles, 1px TOC rail

c927740

Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

Tighten home tile spacing, raise edge dots over TOC, flat product and…

0c34188

… spec icons Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

Use new product switcher icons in dark mode, enlarge gRPC mark

8eddff7

Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

Use Fern design-system glyphs for product switcher and Supported spec…

94f8fb1

…s icons Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

Hairline-style isometric tiles for product switcher and Supported spe…

9b121cf

…cs icons Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

Larger glyphs on product switcher Hairline tiles

e1103b4

Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

Flat Hairline tiles with thinner glyphs for product switcher and Supp…

1519510

…orted specs Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

Canvas home layout with code explorer and Connect your agent section

466bdbe

Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

Format CanvasHome

abe8ec2

Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

Trigger docs preview

e329a92

Co-Authored-By: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>

kgowru requested review from jkonrath-postman and nerminamiller-postman as code owners October 28, 2026 02:52

github-actions Bot reviewed Oct 28, 2026

View reviewed changes

Navigation Menu

Repository navigation

Redesign docs with canvas layout, new home page, and design-system icons - #7641

Redesign docs with canvas layout, new home page, and design-system icons#7641
kgowru wants to merge 67 commits into
mainfrom
kgowru/redesign-canvas-layout

kgowru commented Oct 28, 2026

Uh oh!

github-actions Bot Oct 28, 2026

Uh oh!

github-actions Bot Oct 28, 2026

Uh oh!

github-actions Bot Oct 28, 2026

Uh oh!

github-actions Bot Oct 28, 2026

Uh oh!

github-actions Bot Oct 28, 2026

Uh oh!

github-actions Bot Oct 28, 2026

Uh oh!

github-actions Bot Oct 28, 2026

Uh oh!

github-actions Bot Oct 28, 2026

Uh oh!

github-actions Bot Oct 28, 2026

Uh oh!

github-actions Bot Oct 28, 2026

Uh oh!

github-actions Bot commented Oct 28, 2026

Uh oh!

Reviewers

Uh oh!

Assignees

Labels

Projects

Milestone

Development

Uh oh!

1 participant

Conversation

kgowru commented Oct 28, 2026

Uh oh!

github-actions Bot Oct 28, 2026

Choose a reason for hiding this comment

Uh oh!

github-actions Bot Oct 28, 2026

Choose a reason for hiding this comment

Uh oh!

github-actions Bot Oct 28, 2026

Choose a reason for hiding this comment

Uh oh!

github-actions Bot Oct 28, 2026

Choose a reason for hiding this comment

Uh oh!

github-actions Bot Oct 28, 2026

Choose a reason for hiding this comment

Uh oh!

github-actions Bot Oct 28, 2026

Choose a reason for hiding this comment

Uh oh!

github-actions Bot Oct 28, 2026

Choose a reason for hiding this comment

Uh oh!

github-actions Bot Oct 28, 2026

Choose a reason for hiding this comment

Uh oh!

github-actions Bot Oct 28, 2026

Choose a reason for hiding this comment

Uh oh!

github-actions Bot Oct 28, 2026

Choose a reason for hiding this comment

Uh oh!

github-actions Bot commented Oct 28, 2026

Uh oh!

Reviewers

Uh oh!

Assignees

Labels

Projects

Milestone

Development

Uh oh!

1 participant