Source: https://fiberplane.com/. Extracted 2026-10-14. Scope: public marketing website CSS; declared styles, not computed browser values. This is an observed inventory, not an official internal design system.

Typography

font-family: sans-serif — selector body,input,textarea,select,button
font-family: var(--font-family) — selector [data-framer-component-type=Text] div div span,[data-framer-component-type=Text] a div span,[data-framer-component-type=Text] span span span,[data-framer-component-type=Text] p span span,[data-framer-component-type=Text] h1 span span,[data-framer-com
font-family: var(--framer-font-family-preview,var(--framer-blockquote-font-family,var(--framer-font-family,Inter, Inter Placeholder, sans-serif))) — selector p.framer-text,div.framer-text,h1.framer-text,h2.framer-text,h3.framer-text,h4.framer-text,h5.framer-text,h6.framer-text,li.framer-text,ol.framer-text,ul.framer-text,mark.framer-text,span.framer-text:not([data-text-fill])
font-family: var(--framer-code-font-family,var(--framer-font-family,Inter, Inter Placeholder, sans-serif)) — selector code.framer-text,code.framer-text span.framer-text:not([data-text-fill])
font-family: var(--framer-font-family-preview,var(--framer-link-font-family,var(--framer-blockquote-font-family,var(--framer-font-family,Inter, Inter Placeholder, sans-serif)))) — selector a.framer-text,a.framer-text span.framer-text:not([data-text-fill]),span.framer-text[data-nested-link],span.framer-text[data-nested-link] span.framer-text:not([data-text-fill])
font-family: var(--framer-font-family-preview,var(--framer-link-hover-font-family,var(--framer-link-font-family,var(--framer-blockquote-font-family,var(--framer-font-family,Inter, Inter Placeholder, sans-serif))))) — selector a.framer-text:hover,a.framer-text:hover span.framer-text:not([data-text-fill]),span.framer-text[data-nested-link]:hover,span.framer-text[data-nested-link]:hover span.framer-text:not([data-text-fill])
font-family: var(--framer-font-family-preview,var(--framer-link-current-font-family,var(--framer-link-font-family,var(--framer-font-family,Inter, Inter Placeholder, sans-serif)))) — selector a.framer-text[data-framer-page-link-current],a.framer-text[data-framer-page-link-current] span.framer-text:not([data-text-fill]),span.framer-text[data-framer-page-link-current],span.framer-text[data-framer-page-link-current] span.framer-text:not([dat
font-family: var(--framer-font-family-preview,var(--framer-link-hover-font-family,var(--framer-link-current-font-family,var(--framer-link-font-family,var(--framer-font-family,Inter, Inter Placeholder, sans-serif))))) — selector a.framer-text[data-framer-page-link-current]:hover,a.framer-text[data-framer-page-link-current]:hover span.framer-text:not([data-text-fill]),span.framer-text[data-framer-page-link-current]:hover,span.framer-text[data-framer-page-link-current]:hover s
font-size: 12px — selector body,input,textarea,select,button
font-size: var(--font-size) — selector [data-framer-component-type=Text] div div span,[data-framer-component-type=Text] a div span,[data-framer-component-type=Text] span span span,[data-framer-component-type=Text] p span span,[data-framer-component-type=Text] h1 span span,[data-framer-com
font-size: calc(var(--framer-blockquote-font-size,var(--framer-font-size,16px)) _ var(--framer-font-size-scale,1)) — selector p.framer-text,div.framer-text,h1.framer-text,h2.framer-text,h3.framer-text,h4.framer-text,h5.framer-text,h6.framer-text,li.framer-text,ol.framer-text,ul.framer-text,mark.framer-text,span.framer-text:not([data-text-fill])
font-size: calc(var(--framer-link-hover-font-size,var(--framer-blockquote-font-size,var(--framer-font-size,16px))) _ var(--framer-font-size-scale,1)) — selector a.framer-text:hover,a.framer-text:hover span.framer-text:not([data-text-fill]),span.framer-text[data-nested-link]:hover,span.framer-text[data-nested-link]:hover span.framer-text:not([data-text-fill])
font-size: calc(var(--framer-link-current-font-size,var(--framer-link-font-size,var(--framer-font-size,16px))) _ var(--framer-font-size-scale,1)) — selector a.framer-text[data-framer-page-link-current],a.framer-text[data-framer-page-link-current] span.framer-text:not([data-text-fill]),span.framer-text[data-framer-page-link-current],span.framer-text[data-framer-page-link-current] span.framer-text:not([dat
font-size: calc(var(--framer-link-hover-font-size,var(--framer-link-current-font-size,var(--framer-link-font-size,var(--framer-font-size,16px)))) _ var(--framer-font-size-scale,1)) — selector a.framer-text[data-framer-page-link-current]:hover,a.framer-text[data-framer-page-link-current]:hover span.framer-text:not([data-text-fill]),span.framer-text[data-framer-page-link-current]:hover,span.framer-text[data-framer-page-link-current]:hover s
font-size: var(--framer-font-size,16px) — selector [data-framer-component-type=DeprecatedRichText] p,[data-framer-component-type=DeprecatedRichText] div,[data-framer-component-type=DeprecatedRichText] h1,[data-framer-component-type=DeprecatedRichText] h2,[data-framer-component-type=DeprecatedRichText
font-size: var(--framer-link-font-size,var(--framer-font-size,16px)) — selector [data-framer-component-type=DeprecatedRichText] a,[data-framer-component-type=DeprecatedRichText] a span:not([data-text-fill])
font-weight: min(calc(var(--framer-font-weight-increase,0) + var(--font-weight,400)), 900) — selector [data-framer-component-type=Text] div div span,[data-framer-component-type=Text] a div span,[data-framer-component-type=Text] span span span,[data-framer-component-type=Text] p span span,[data-framer-component-type=Text] h1 span span,[data-framer-com
font-weight: var(--framer-font-weight-preview,var(--framer-blockquote-font-weight,var(--framer-font-weight,400))) — selector p.framer-text,div.framer-text,h1.framer-text,h2.framer-text,h3.framer-text,h4.framer-text,h5.framer-text,h6.framer-text,li.framer-text,ol.framer-text,ul.framer-text,mark.framer-text,span.framer-text:not([data-text-fill])
font-weight: var(--framer-blockquote-font-weight,var(--framer-code-font-weight,var(--framer-font-weight,400))) — selector code.framer-text,code.framer-text span.framer-text:not([data-text-fill])
font-weight: var(--framer-font-weight-preview,var(--framer-link-font-weight,var(--framer-blockquote-font-weight,var(--framer-font-weight,400)))) — selector a.framer-text,a.framer-text span.framer-text:not([data-text-fill]),span.framer-text[data-nested-link],span.framer-text[data-nested-link] span.framer-text:not([data-text-fill])
font-weight: var(--framer-font-weight-preview,var(--framer-link-hover-font-weight,var(--framer-link-font-weight,var(--framer-blockquote-font-weight,var(--framer-font-weight,400))))) — selector a.framer-text:hover,a.framer-text:hover span.framer-text:not([data-text-fill]),span.framer-text[data-nested-link]:hover,span.framer-text[data-nested-link]:hover span.framer-text:not([data-text-fill])
font-weight: var(--framer-font-weight-preview,var(--framer-link-current-font-weight,var(--framer-link-font-weight,var(--framer-font-weight,400)))) — selector a.framer-text[data-framer-page-link-current],a.framer-text[data-framer-page-link-current] span.framer-text:not([data-text-fill]),span.framer-text[data-framer-page-link-current],span.framer-text[data-framer-page-link-current] span.framer-text:not([dat
font-weight: var(--framer-code-font-weight,var(--framer-font-weight,400)) — selector code.framer-text a.framer-text[data-framer-page-link-current],code.framer-text a.framer-text[data-framer-page-link-current] span.framer-text:not([data-text-fill]),code.framer-text span.framer-text[data-framer-page-link-current],code.framer-text span.
font-weight: var(--framer-font-weight-preview,var(--framer-link-hover-font-weight,var(--framer-link-current-font-weight,var(--framer-link-font-weight,var(--framer-font-weight,400))))) — selector a.framer-text[data-framer-page-link-current]:hover,a.framer-text[data-framer-page-link-current]:hover span.framer-text:not([data-text-fill]),span.framer-text[data-framer-page-link-current]:hover,span.framer-text[data-framer-page-link-current]:hover s
line-height: var(--line-height) — selector [data-framer-component-type=Text] div div span,[data-framer-component-type=Text] a div span,[data-framer-component-type=Text] span span span,[data-framer-component-type=Text] p span span,[data-framer-component-type=Text] h1 span span,[data-framer-com
line-height: var(--framer-blockquote-line-height,var(--framer-line-height,1.2em)) — selector p.framer-text,div.framer-text,h1.framer-text,h2.framer-text,h3.framer-text,h4.framer-text,h5.framer-text,h6.framer-text,li.framer-text,ol.framer-text,ul.framer-text,mark.framer-text,span.framer-text:not([data-text-fill])
line-height: var(--framer-line-height,1.2em) — selector [data-framer-component-type=DeprecatedRichText] p,[data-framer-component-type=DeprecatedRichText] div,[data-framer-component-type=DeprecatedRichText] h1,[data-framer-component-type=DeprecatedRichText] h2,[data-framer-component-type=DeprecatedRichText
letter-spacing: var(--letter-spacing) — selector [data-framer-component-type=Text] div div span,[data-framer-component-type=Text] a div span,[data-framer-component-type=Text] span span span,[data-framer-component-type=Text] p span span,[data-framer-component-type=Text] h1 span span,[data-framer-com
letter-spacing: var(--framer-blockquote-letter-spacing,var(--framer-letter-spacing,0)) — selector p.framer-text,div.framer-text,h1.framer-text,h2.framer-text,h3.framer-text,h4.framer-text,h5.framer-text,h6.framer-text,li.framer-text,ol.framer-text,ul.framer-text,mark.framer-text,span.framer-text:not([data-text-fill])
letter-spacing: var(--framer-letter-spacing,0) — selector [data-framer-component-type=DeprecatedRichText] p,[data-framer-component-type=DeprecatedRichText] div,[data-framer-component-type=DeprecatedRichText] h1,[data-framer-component-type=DeprecatedRichText] h2,[data-framer-component-type=DeprecatedRichText

Colors and surfaces

color: var(--text-color) — selector [data-framer-component-type=Text] div div span,[data-framer-component-type=Text] a div span,[data-framer-component-type=Text] span span span,[data-framer-component-type=Text] p span span,[data-framer-component-type=Text] h1 span span,[data-framer-com
color: var(--framer-blockquote-text-color-rgb,var(--framer-blockquote-text-color,var(--framer-text-color-rgb,var(--framer-text-color,#000)))) — selector p.framer-text,div.framer-text,h1.framer-text,h2.framer-text,h3.framer-text,h4.framer-text,h5.framer-text,h6.framer-text,li.framer-text,ol.framer-text,ul.framer-text,span.framer-text:not([data-text-fill])
color: var(--framer-blockquote-text-color-rgb,var(--framer-blockquote-text-color,var(--framer-code-text-color-rgb,var(--framer-code-text-color,var(--framer-text-color-rgb,var(--framer-text-color,#000)))))) — selector code.framer-text,code.framer-text span.framer-text:not([data-text-fill])
color: var(--framer-link-text-color-rgb,var(--framer-link-text-color,var(--framer-blockquote-text-color-rgb,var(--framer-blockquote-text-color,var(--framer-text-color-rgb,var(--framer-text-color,#000)))))) — selector a.framer-text,span.framer-text[data-nested-link]
color: var(--framer-link-current-text-color-rgb,var(--framer-link-current-text-color,var(--framer-link-text-color-rgb,var(--framer-link-text-color,var(--framer-text-color-rgb,var(--framer-text-color,#000)))))) — selector a.framer-text[data-framer-page-link-current],span.framer-text[data-framer-page-link-current]
color: var(--framer-blockquote-text-color,var(--framer-text-color,#000)) — selector p.framer-text,div.framer-text,h1.framer-text,h2.framer-text,h3.framer-text,h4.framer-text,h5.framer-text,h6.framer-text,li.framer-text,ol.framer-text,ul.framer-text,mark.framer-text,span.framer-text:not([data-text-fill])
color: var(--framer-blockquote-text-color,var(--framer-code-text-color,var(--framer-text-color,#000))) — selector code.framer-text,code.framer-text span.framer-text:not([data-text-fill])
background-color: var(--framer-link-text-background-color-rgb,var(--framer-link-text-background-color,initial)) — selector a.framer-text,span.framer-text[data-nested-link]
background-color: var(--framer-blockquote-text-background-color,var(--framer-text-background-color,initial)) — selector mark.framer-text,p.framer-text,div.framer-text,h1.framer-text,h2.framer-text,h3.framer-text,h4.framer-text,h5.framer-text,h6.framer-text,li.framer-text,ol.framer-text,ul.framer-text
background-color: initial — selector a.framer-text,a.framer-text span.framer-text:not([data-text-fill]),span.framer-text[data-nested-link],span.framer-text[data-nested-link] span.framer-text:not([data-text-fill])
background-color: var(--framer-link-text-background-color,initial) — selector a.framer-text,span.framer-text[data-nested-link]
background-color: var(--framer-link-hover-text-background-color,var(--framer-link-text-background-color,var(--framer-text-background-color,initial))) — selector a.framer-text:hover,span.framer-text[data-nested-link]:hover
background-color: var(--framer-link-current-text-background-color,var(--framer-link-text-background-color,var(--framer-text-background-color,initial))) — selector a.framer-text[data-framer-page-link-current],span.framer-text[data-framer-page-link-current]
background-color: var(--framer-link-hover-text-background-color,var(--framer-link-current-text-background-color,var(--framer-link-text-background-color,initial))) — selector a.framer-text[data-framer-page-link-current]:hover,span.framer-text[data-framer-page-link-current]:hover

Components and layout

border-radius: var(--framer-blockquote-text-background-radius,var(--framer-text-background-radius,initial)) — selector mark.framer-text,p.framer-text,div.framer-text,h1.framer-text,h2.framer-text,h3.framer-text,h4.framer-text,h5.framer-text,h6.framer-text,li.framer-text,ol.framer-text,ul.framer-text
border-radius: var(--framer-link-text-background-radius,initial) — selector a.framer-text,a.framer-text span.framer-text:not([data-text-fill]),span.framer-text[data-nested-link],span.framer-text[data-nested-link] span.framer-text:not([data-text-fill])
border-radius: var(--framer-link-hover-text-background-radius,var(--framer-link-text-background-radius,var(--framer-text-background-radius,initial))) — selector a.framer-text:hover,a.framer-text:hover span.framer-text:not([data-text-fill]),span.framer-text[data-nested-link]:hover,span.framer-text[data-nested-link]:hover span.framer-text:not([data-text-fill])
border-radius: var(--framer-link-current-text-background-radius,var(--framer-link-text-background-radius,initial)) — selector a.framer-text[data-framer-page-link-current],a.framer-text[data-framer-page-link-current] span.framer-text:not([data-text-fill]),span.framer-text[data-framer-page-link-current],span.framer-text[data-framer-page-link-current] span.framer-text:not([dat
border-radius: var(--framer-link-hover-text-background-radius,var(--framer-link-current-text-background-radius,var(--framer-link-text-background-radius,initial))) — selector a.framer-text[data-framer-page-link-current]:hover,a.framer-text[data-framer-page-link-current]:hover span.framer-text:not([data-text-fill]),span.framer-text[data-framer-page-link-current]:hover,span.framer-text[data-framer-page-link-current]:hover s
max-width: 1216px — selector .framer-OAp9l .framer-1aywa82-container,.framer-OAp9l .framer-7t5d04-container
padding: 0 — selector html,body,#main
padding: var(--framer-blockquote-text-background-padding,var(--framer-text-background-padding,initial)) — selector mark.framer-text,p.framer-text,div.framer-text,h1.framer-text,h2.framer-text,h3.framer-text,h4.framer-text,h5.framer-text,h6.framer-text,li.framer-text,ol.framer-text,ul.framer-text
padding: max(0em, calc(calc(1.3em - var(--framer-blockquote-line-height,var(--framer-line-height,1.3em))) / 2)) — selector .framer-text[data-text-fill]
padding: var(--framer-link-text-background-padding,initial) — selector a.framer-text,a.framer-text span.framer-text:not([data-text-fill]),span.framer-text[data-nested-link],span.framer-text[data-nested-link] span.framer-text:not([data-text-fill])
padding: var(--framer-link-hover-text-background-padding,var(--framer-link-text-background-padding,var(--framer-text-background-padding,initial))) — selector a.framer-text:hover,a.framer-text:hover span.framer-text:not([data-text-fill]),span.framer-text[data-nested-link]:hover,span.framer-text[data-nested-link]:hover span.framer-text:not([data-text-fill])
padding: var(--framer-link-current-text-background-padding,var(--framer-link-text-background-padding,initial)) — selector a.framer-text[data-framer-page-link-current],a.framer-text[data-framer-page-link-current] span.framer-text:not([data-text-fill]),span.framer-text[data-framer-page-link-current],span.framer-text[data-framer-page-link-current] span.framer-text:not([dat
padding: var(--framer-link-hover-text-background-padding,var(--framer-link-current-text-background-padding,var(--framer-link-text-background-padding,initial))) — selector a.framer-text[data-framer-page-link-current]:hover,a.framer-text[data-framer-page-link-current]:hover span.framer-text:not([data-text-fill]),span.framer-text[data-framer-page-link-current]:hover,span.framer-text[data-framer-page-link-current]:hover s
gap: 0 — selector .framer-OAp9l.framer-4wvff4
gap: 40px — selector .framer-OAp9l.framer-17zmjho
gap: 28px — selector .framer-OAp9l .framer-129eml
gap: 10px — selector .framer-OAp9l .framer-1pq09l5,.framer-OAp9l .framer-13x2rhs
gap: 76px — selector .framer-4glZN .framer-abkw5o
gap: 24px — selector .framer-4glZN .framer-4ke6qx
gap: 20px — selector .framer-4glZN .framer-5a67k8
gap: 32px — selector .framer-4glZN .framer-abkw5o

Responsive rules

(min-width: 2240px)
(min-width: 1718px) and (max-width: 2239.98px)
(min-width: 1200px) and (max-width: 1717.98px)
(min-width: 768px) and (max-width: 1199.98px)
(max-width: 767.98px)
(prefers-color-scheme:dark)
(min-width:1200px) and (max-width:1717.98px)
(min-width:768px) and (max-width:1199.98px)
(min-width:2240px)
(max-width:767.98px)
(max-width:1899px) and (min-width:1718px)
(max-width:1717px) and (min-width:1200px)
(max-width:1199px) and (min-width:768px)
(max-width:767px) and (min-width:0)

Original CSS custom-property declarations, grouped by source and selector. Up to 250 declarations; selectors preserved; media-query conditions are not attached to individual declarations.

https://fiberplane.com/ — body

--token-520e2a9e-3b80-4e65-a5ef-eaada36a3421: #191919;
--token-aa3ec488-a4b3-4ebf-9fa5-65de141433f4: #5d5b56;
--token-509a6b49-a9d5-4dad-9454-d3b77a845cf0: #77756f;
--token-3a51bae9-11c6-4da8-8199-e61b543769c0: #3d3c39;
--token-20f88516-71f9-4a02-a3b9-b67bbe2df6e8: #b8b8b8;
--token-31638a61-9c62-4550-9fe6-b8516b9ff744: #f5f4f0;
--token-6075b55f-a404-4a2f-9579-89869f6f8807: #ecebe7;
--token-4b112961-c5e9-4629-9221-4e2ab09f3709: #fff;
--token-fd53e61e-1176-4033-96d3-b252269624e1: #d9d8d3;
--token-39ad34c6-cc29-4ba1-9a67-55e9101cc046: #deddd8;
--token-68d83e8b-f25f-4871-b3b2-a81dba6a5bda: #f7e8d2;
--token-2ca9cecd-654c-4abd-bd5e-c94c4a01a657: #deddd8;
--token-b2bd66b7-d553-48eb-b21f-382ba5b42925: #c9c7c1;
--token-47bfe4fe-0092-427a-afad-7b518094a68b: #1e7fc4;
--token-9c7f6f87-3aff-4af2-9ccc-b7e09d44c9be: #1c1b191f;
--token-e1893417-ac68-4ea7-be87-fdbc9288af87: #1c1b190d;
--token-520e2a9e-3b80-4e65-a5ef-eaada36a3421: #fafafa;
--token-aa3ec488-a4b3-4ebf-9fa5-65de141433f4: #a8a8a8;
--token-509a6b49-a9d5-4dad-9454-d3b77a845cf0: #767676;
--token-3a51bae9-11c6-4da8-8199-e61b543769c0: #d6d6d6;
--token-20f88516-71f9-4a02-a3b9-b67bbe2df6e8: #a8a8a8;
--token-31638a61-9c62-4550-9fe6-b8516b9ff744: #141414;
--token-6075b55f-a404-4a2f-9579-89869f6f8807: #1f1f1f;
--token-4b112961-c5e9-4629-9221-4e2ab09f3709: #1f1f1f;
--token-fd53e61e-1176-4033-96d3-b252269624e1: #1f1f1f;
--token-39ad34c6-cc29-4ba1-9a67-55e9101cc046: #2e2e2e;
--token-68d83e8b-f25f-4871-b3b2-a81dba6a5bda: #351e07;
--token-2ca9cecd-654c-4abd-bd5e-c94c4a01a657: #2e2e2e;
--token-b2bd66b7-d553-48eb-b21f-382ba5b42925: #454545;
--token-47bfe4fe-0092-427a-afad-7b518094a68b: #55b0f7;
--token-9c7f6f87-3aff-4af2-9ccc-b7e09d44c9be: #ffffff0d;
--token-e1893417-ac68-4ea7-be87-fdbc9288af87: #ffffff0d;

https://fiberplane.com/ — [data-framer-component-type=Text] div div span,[data-framer-component-type=Text] a div span,[data-framer-component-type=Text] span span span,[data-framer-component-type=Text] p span span,[data-framer-component-type=Text] h1 span span,[data-framer-component-type=Text] h2 span span,[data-framer-component-type=Text] h3 span span,[data-framer-component-type=Text] h4 span span,[data-framer-component-type=Text] h5 span span,[data-framer-component-type=Text] h6 span span,[data-framer-component-type=Text] a

--text-decoration: var(--framer-text-decoration-style,solid) var(--framer-text-decoration,none) var(--framer-text-decoration-color,currentcolor) var(--framer-text-decoration-thickness,auto);
--text-decoration-skip-ink: var(--framer-text-decoration-skip-ink);
--text-underline-offset: var(--framer-text-decoration-offset);
--font-family: var(--framer-font-family);
--font-style: var(--framer-font-style);
--font-weight: var(--framer-font-weight);
--text-color: var(--framer-text-color);
--letter-spacing: var(--framer-letter-spacing);
--font-size: var(--framer-font-size);
--text-transform: var(--framer-text-transform);
--line-height: var(--framer-line-height);

https://fiberplane.com/ — :root

--overflow-clip-fallback: hidden;
--one-if-corner-shape-supported: 1;

https://fiberplane.com/ — [data-framer-component-type=Text] a,[data-framer-component-type=Text] a div span,[data-framer-component-type=Text] a span span span,[data-framer-component-type=Text] a p span span,[data-framer-component-type=Text] a h1 span span,[data-framer-component-type=Text] a h2 span span,[data-framer-component-type=Text] a h3 span span,[data-framer-component-type=Text] a h4 span span,[data-framer-component-type=Text] a h5 span span,[data-framer-component-type=Text] a h6 span span

--font-family: var(--framer-link-font-family,var(--framer-font-family));
--font-style: var(--framer-link-font-style,var(--framer-font-style));
--font-weight: var(--framer-link-font-weight,var(--framer-font-weight));
--text-color: var(--framer-link-text-color,var(--framer-text-color));
--font-size: var(--framer-link-font-size,var(--framer-font-size));
--text-transform: var(--framer-link-text-transform,var(--framer-text-transform));
--text-decoration: var(--framer-link-text-decoration-style,var(--framer-text-decoration-style,solid)) var(--framer-link-text-decoration,var(--framer-text-decoration,none)) var(--framer-link-text-decoration-color,var(--framer-text-decoration-color,currentcolor)) var(--framer-link-text-decoration-thickness,var(--framer-text-decoration-thickness,auto));
--text-decoration-skip-ink: var(--framer-link-text-decoration-skip-ink,var(--framer-text-decoration-skip-ink));
--text-underline-offset: var(--framer-link-text-decoration-offset,var(--framer-text-decoration-offset));

https://fiberplane.com/ — [data-framer-component-type=Text] a:hover,[data-framer-component-type=Text] a div span:hover,[data-framer-component-type=Text] a span span span:hover,[data-framer-component-type=Text] a p span span:hover,[data-framer-component-type=Text] a h1 span span:hover,[data-framer-component-type=Text] a h2 span span:hover,[data-framer-component-type=Text] a h3 span span:hover,[data-framer-component-type=Text] a h4 span span:hover,[data-framer-component-type=Text] a h5 span span:hover,[data-framer-component-type=Text] a h6 span span:hover

--font-family: var(--framer-link-hover-font-family,var(--framer-link-font-family,var(--framer-font-family)));
--font-style: var(--framer-link-hover-font-style,var(--framer-link-font-style,var(--framer-font-style)));
--font-weight: var(--framer-link-hover-font-weight,var(--framer-link-font-weight,var(--framer-font-weight)));
--text-color: var(--framer-link-hover-text-color,var(--framer-link-text-color,var(--framer-text-color)));
--font-size: var(--framer-link-hover-font-size,var(--framer-link-font-size,var(--framer-font-size)));
--text-transform: var(--framer-link-hover-text-transform,var(--framer-link-text-transform,var(--framer-text-transform)));
--text-decoration-skip-ink: var(--framer-link-hover-text-decoration-skip-ink,var(--framer-link-text-decoration-skip-ink,var(--framer-text-decoration-skip-ink)));
--text-underline-offset: var(--framer-link-hover-text-decoration-offset,var(--framer-link-text-decoration-offset,var(--framer-text-decoration-offset)));

https://fiberplane.com/ — [data-framer-component-type=Text].isCurrent a,[data-framer-component-type=Text].isCurrent a div span,[data-framer-component-type=Text].isCurrent a span span span,[data-framer-component-type=Text].isCurrent a p span span,[data-framer-component-type=Text].isCurrent a h1 span span,[data-framer-component-type=Text].isCurrent a h2 span span,[data-framer-component-type=Text].isCurrent a h3 span span,[data-framer-component-type=Text].isCurrent a h4 span span,[data-framer-component-type=Text].isCurrent a h5 span span,[data-framer-component-type=Text].isCurrent a h6 span span

--font-family: var(--framer-link-current-font-family,var(--framer-link-font-family,var(--framer-font-family)));
--font-style: var(--framer-link-current-font-style,var(--framer-link-font-style,var(--framer-font-style)));
--font-weight: var(--framer-link-current-font-weight,var(--framer-link-font-weight,var(--framer-font-weight)));
--text-color: var(--framer-link-current-text-color,var(--framer-link-text-color,var(--framer-text-color)));
--font-size: var(--framer-link-current-font-size,var(--framer-link-font-size,var(--framer-font-size)));
--text-transform: var(--framer-link-current-text-transform,var(--framer-link-text-transform,var(--framer-text-transform)));
--text-decoration-skip-ink: var(--framer-link-current-text-decoration-skip-ink,var(--framer-link-text-decoration-skip-ink,var(--framer-text-decoration-skip-ink)));
--text-underline-offset: var(--framer-link-current-text-decoration-offset,var(--framer-link-text-decoration-offset,var(--framer-text-decoration-offset)));

https://fiberplane.com/ — ol.framer-text

--list-style-type: decimal;

https://fiberplane.com/ — [data-framer-component-type=DeprecatedRichText] .text-styles-preset-reset

--font-variation-settings: normal;

Observed design values, with source selectors. Names shown are CSS properties, not invented official token names.

Property	Declared value	Selector
font-family	`sans-serif`	`body,input,textarea,select,button`
font-family	`var(--font-family)`	`[data-framer-component-type=Text] div div span,[data-framer-component-type=Text] a div span,[data-framer-component-type=Text] span span span,[data-framer-component-type=Text] p span span,[data-framer-component-type=Text] h1 span span,[data-framer-com`
font-family	`var(--framer-font-family-preview,var(--framer-blockquote-font-family,var(--framer-font-family,Inter, Inter Placeholder, sans-serif)))`	`p.framer-text,div.framer-text,h1.framer-text,h2.framer-text,h3.framer-text,h4.framer-text,h5.framer-text,h6.framer-text,li.framer-text,ol.framer-text,ul.framer-text,mark.framer-text,span.framer-text:not([data-text-fill])`
font-family	`var(--framer-code-font-family,var(--framer-font-family,Inter, Inter Placeholder, sans-serif))`	`code.framer-text,code.framer-text span.framer-text:not([data-text-fill])`
font-family	`var(--framer-font-family-preview,var(--framer-link-font-family,var(--framer-blockquote-font-family,var(--framer-font-family,Inter, Inter Placeholder, sans-serif))))`	`a.framer-text,a.framer-text span.framer-text:not([data-text-fill]),span.framer-text[data-nested-link],span.framer-text[data-nested-link] span.framer-text:not([data-text-fill])`
font-family	`var(--framer-font-family-preview,var(--framer-link-hover-font-family,var(--framer-link-font-family,var(--framer-blockquote-font-family,var(--framer-font-family,Inter, Inter Placeholder, sans-serif)))))`	`a.framer-text:hover,a.framer-text:hover span.framer-text:not([data-text-fill]),span.framer-text[data-nested-link]:hover,span.framer-text[data-nested-link]:hover span.framer-text:not([data-text-fill])`
font-family	`var(--framer-font-family-preview,var(--framer-link-current-font-family,var(--framer-link-font-family,var(--framer-font-family,Inter, Inter Placeholder, sans-serif))))`	`a.framer-text[data-framer-page-link-current],a.framer-text[data-framer-page-link-current] span.framer-text:not([data-text-fill]),span.framer-text[data-framer-page-link-current],span.framer-text[data-framer-page-link-current] span.framer-text:not([dat`
font-family	`var(--framer-font-family-preview,var(--framer-link-hover-font-family,var(--framer-link-current-font-family,var(--framer-link-font-family,var(--framer-font-family,Inter, Inter Placeholder, sans-serif)))))`	`a.framer-text[data-framer-page-link-current]:hover,a.framer-text[data-framer-page-link-current]:hover span.framer-text:not([data-text-fill]),span.framer-text[data-framer-page-link-current]:hover,span.framer-text[data-framer-page-link-current]:hover s`
font-size	`12px`	`body,input,textarea,select,button`
font-size	`var(--font-size)`	`[data-framer-component-type=Text] div div span,[data-framer-component-type=Text] a div span,[data-framer-component-type=Text] span span span,[data-framer-component-type=Text] p span span,[data-framer-component-type=Text] h1 span span,[data-framer-com`
font-size	`calc(var(--framer-blockquote-font-size,var(--framer-font-size,16px)) _ var(--framer-font-size-scale,1))`	`p.framer-text,div.framer-text,h1.framer-text,h2.framer-text,h3.framer-text,h4.framer-text,h5.framer-text,h6.framer-text,li.framer-text,ol.framer-text,ul.framer-text,mark.framer-text,span.framer-text:not([data-text-fill])`
font-size	`calc(var(--framer-link-hover-font-size,var(--framer-blockquote-font-size,var(--framer-font-size,16px))) _ var(--framer-font-size-scale,1))`	`a.framer-text:hover,a.framer-text:hover span.framer-text:not([data-text-fill]),span.framer-text[data-nested-link]:hover,span.framer-text[data-nested-link]:hover span.framer-text:not([data-text-fill])`
font-size	`calc(var(--framer-link-current-font-size,var(--framer-link-font-size,var(--framer-font-size,16px))) _ var(--framer-font-size-scale,1))`	`a.framer-text[data-framer-page-link-current],a.framer-text[data-framer-page-link-current] span.framer-text:not([data-text-fill]),span.framer-text[data-framer-page-link-current],span.framer-text[data-framer-page-link-current] span.framer-text:not([dat`
font-size	`calc(var(--framer-link-hover-font-size,var(--framer-link-current-font-size,var(--framer-link-font-size,var(--framer-font-size,16px)))) _ var(--framer-font-size-scale,1))`	`a.framer-text[data-framer-page-link-current]:hover,a.framer-text[data-framer-page-link-current]:hover span.framer-text:not([data-text-fill]),span.framer-text[data-framer-page-link-current]:hover,span.framer-text[data-framer-page-link-current]:hover s`
font-size	`var(--framer-font-size,16px)`	`[data-framer-component-type=DeprecatedRichText] p,[data-framer-component-type=DeprecatedRichText] div,[data-framer-component-type=DeprecatedRichText] h1,[data-framer-component-type=DeprecatedRichText] h2,[data-framer-component-type=DeprecatedRichText`
font-size	`var(--framer-link-font-size,var(--framer-font-size,16px))`	`[data-framer-component-type=DeprecatedRichText] a,[data-framer-component-type=DeprecatedRichText] a span:not([data-text-fill])`
font-weight	`min(calc(var(--framer-font-weight-increase,0) + var(--font-weight,400)), 900)`	`[data-framer-component-type=Text] div div span,[data-framer-component-type=Text] a div span,[data-framer-component-type=Text] span span span,[data-framer-component-type=Text] p span span,[data-framer-component-type=Text] h1 span span,[data-framer-com`
font-weight	`var(--framer-font-weight-preview,var(--framer-blockquote-font-weight,var(--framer-font-weight,400)))`	`p.framer-text,div.framer-text,h1.framer-text,h2.framer-text,h3.framer-text,h4.framer-text,h5.framer-text,h6.framer-text,li.framer-text,ol.framer-text,ul.framer-text,mark.framer-text,span.framer-text:not([data-text-fill])`
font-weight	`var(--framer-blockquote-font-weight,var(--framer-code-font-weight,var(--framer-font-weight,400)))`	`code.framer-text,code.framer-text span.framer-text:not([data-text-fill])`
font-weight	`var(--framer-font-weight-preview,var(--framer-link-font-weight,var(--framer-blockquote-font-weight,var(--framer-font-weight,400))))`	`a.framer-text,a.framer-text span.framer-text:not([data-text-fill]),span.framer-text[data-nested-link],span.framer-text[data-nested-link] span.framer-text:not([data-text-fill])`
font-weight	`var(--framer-font-weight-preview,var(--framer-link-hover-font-weight,var(--framer-link-font-weight,var(--framer-blockquote-font-weight,var(--framer-font-weight,400)))))`	`a.framer-text:hover,a.framer-text:hover span.framer-text:not([data-text-fill]),span.framer-text[data-nested-link]:hover,span.framer-text[data-nested-link]:hover span.framer-text:not([data-text-fill])`
font-weight	`var(--framer-font-weight-preview,var(--framer-link-current-font-weight,var(--framer-link-font-weight,var(--framer-font-weight,400))))`	`a.framer-text[data-framer-page-link-current],a.framer-text[data-framer-page-link-current] span.framer-text:not([data-text-fill]),span.framer-text[data-framer-page-link-current],span.framer-text[data-framer-page-link-current] span.framer-text:not([dat`
font-weight	`var(--framer-code-font-weight,var(--framer-font-weight,400))`	`code.framer-text a.framer-text[data-framer-page-link-current],code.framer-text a.framer-text[data-framer-page-link-current] span.framer-text:not([data-text-fill]),code.framer-text span.framer-text[data-framer-page-link-current],code.framer-text span.`
font-weight	`var(--framer-font-weight-preview,var(--framer-link-hover-font-weight,var(--framer-link-current-font-weight,var(--framer-link-font-weight,var(--framer-font-weight,400)))))`	`a.framer-text[data-framer-page-link-current]:hover,a.framer-text[data-framer-page-link-current]:hover span.framer-text:not([data-text-fill]),span.framer-text[data-framer-page-link-current]:hover,span.framer-text[data-framer-page-link-current]:hover s`
line-height	`var(--line-height)`	`[data-framer-component-type=Text] div div span,[data-framer-component-type=Text] a div span,[data-framer-component-type=Text] span span span,[data-framer-component-type=Text] p span span,[data-framer-component-type=Text] h1 span span,[data-framer-com`
line-height	`var(--framer-blockquote-line-height,var(--framer-line-height,1.2em))`	`p.framer-text,div.framer-text,h1.framer-text,h2.framer-text,h3.framer-text,h4.framer-text,h5.framer-text,h6.framer-text,li.framer-text,ol.framer-text,ul.framer-text,mark.framer-text,span.framer-text:not([data-text-fill])`
line-height	`var(--framer-line-height,1.2em)`	`[data-framer-component-type=DeprecatedRichText] p,[data-framer-component-type=DeprecatedRichText] div,[data-framer-component-type=DeprecatedRichText] h1,[data-framer-component-type=DeprecatedRichText] h2,[data-framer-component-type=DeprecatedRichText`
letter-spacing	`var(--letter-spacing)`	`[data-framer-component-type=Text] div div span,[data-framer-component-type=Text] a div span,[data-framer-component-type=Text] span span span,[data-framer-component-type=Text] p span span,[data-framer-component-type=Text] h1 span span,[data-framer-com`
letter-spacing	`var(--framer-blockquote-letter-spacing,var(--framer-letter-spacing,0))`	`p.framer-text,div.framer-text,h1.framer-text,h2.framer-text,h3.framer-text,h4.framer-text,h5.framer-text,h6.framer-text,li.framer-text,ol.framer-text,ul.framer-text,mark.framer-text,span.framer-text:not([data-text-fill])`
letter-spacing	`var(--framer-letter-spacing,0)`	`[data-framer-component-type=DeprecatedRichText] p,[data-framer-component-type=DeprecatedRichText] div,[data-framer-component-type=DeprecatedRichText] h1,[data-framer-component-type=DeprecatedRichText] h2,[data-framer-component-type=DeprecatedRichText`
color	`var(--text-color)`	`[data-framer-component-type=Text] div div span,[data-framer-component-type=Text] a div span,[data-framer-component-type=Text] span span span,[data-framer-component-type=Text] p span span,[data-framer-component-type=Text] h1 span span,[data-framer-com`
color	`var(--framer-blockquote-text-color-rgb,var(--framer-blockquote-text-color,var(--framer-text-color-rgb,var(--framer-text-color,#000))))`	`p.framer-text,div.framer-text,h1.framer-text,h2.framer-text,h3.framer-text,h4.framer-text,h5.framer-text,h6.framer-text,li.framer-text,ol.framer-text,ul.framer-text,span.framer-text:not([data-text-fill])`
color	`var(--framer-blockquote-text-color-rgb,var(--framer-blockquote-text-color,var(--framer-code-text-color-rgb,var(--framer-code-text-color,var(--framer-text-color-rgb,var(--framer-text-color,#000))))))`	`code.framer-text,code.framer-text span.framer-text:not([data-text-fill])`
color	`var(--framer-link-text-color-rgb,var(--framer-link-text-color,var(--framer-blockquote-text-color-rgb,var(--framer-blockquote-text-color,var(--framer-text-color-rgb,var(--framer-text-color,#000))))))`	`a.framer-text,span.framer-text[data-nested-link]`
color	`var(--framer-link-current-text-color-rgb,var(--framer-link-current-text-color,var(--framer-link-text-color-rgb,var(--framer-link-text-color,var(--framer-text-color-rgb,var(--framer-text-color,#000))))))`	`a.framer-text[data-framer-page-link-current],span.framer-text[data-framer-page-link-current]`
color	`var(--framer-blockquote-text-color,var(--framer-text-color,#000))`	`p.framer-text,div.framer-text,h1.framer-text,h2.framer-text,h3.framer-text,h4.framer-text,h5.framer-text,h6.framer-text,li.framer-text,ol.framer-text,ul.framer-text,mark.framer-text,span.framer-text:not([data-text-fill])`
color	`var(--framer-blockquote-text-color,var(--framer-code-text-color,var(--framer-text-color,#000)))`	`code.framer-text,code.framer-text span.framer-text:not([data-text-fill])`
background-color	`var(--framer-link-text-background-color-rgb,var(--framer-link-text-background-color,initial))`	`a.framer-text,span.framer-text[data-nested-link]`
background-color	`var(--framer-blockquote-text-background-color,var(--framer-text-background-color,initial))`	`mark.framer-text,p.framer-text,div.framer-text,h1.framer-text,h2.framer-text,h3.framer-text,h4.framer-text,h5.framer-text,h6.framer-text,li.framer-text,ol.framer-text,ul.framer-text`
background-color	`initial`	`a.framer-text,a.framer-text span.framer-text:not([data-text-fill]),span.framer-text[data-nested-link],span.framer-text[data-nested-link] span.framer-text:not([data-text-fill])`
background-color	`var(--framer-link-text-background-color,initial)`	`a.framer-text,span.framer-text[data-nested-link]`
background-color	`var(--framer-link-hover-text-background-color,var(--framer-link-text-background-color,var(--framer-text-background-color,initial)))`	`a.framer-text:hover,span.framer-text[data-nested-link]:hover`
background-color	`var(--framer-link-current-text-background-color,var(--framer-link-text-background-color,var(--framer-text-background-color,initial)))`	`a.framer-text[data-framer-page-link-current],span.framer-text[data-framer-page-link-current]`
background-color	`var(--framer-link-hover-text-background-color,var(--framer-link-current-text-background-color,var(--framer-link-text-background-color,initial)))`	`a.framer-text[data-framer-page-link-current]:hover,span.framer-text[data-framer-page-link-current]:hover`
border-radius	`var(--framer-blockquote-text-background-radius,var(--framer-text-background-radius,initial))`	`mark.framer-text,p.framer-text,div.framer-text,h1.framer-text,h2.framer-text,h3.framer-text,h4.framer-text,h5.framer-text,h6.framer-text,li.framer-text,ol.framer-text,ul.framer-text`
border-radius	`var(--framer-link-text-background-radius,initial)`	`a.framer-text,a.framer-text span.framer-text:not([data-text-fill]),span.framer-text[data-nested-link],span.framer-text[data-nested-link] span.framer-text:not([data-text-fill])`
border-radius	`var(--framer-link-hover-text-background-radius,var(--framer-link-text-background-radius,var(--framer-text-background-radius,initial)))`	`a.framer-text:hover,a.framer-text:hover span.framer-text:not([data-text-fill]),span.framer-text[data-nested-link]:hover,span.framer-text[data-nested-link]:hover span.framer-text:not([data-text-fill])`
border-radius	`var(--framer-link-current-text-background-radius,var(--framer-link-text-background-radius,initial))`	`a.framer-text[data-framer-page-link-current],a.framer-text[data-framer-page-link-current] span.framer-text:not([data-text-fill]),span.framer-text[data-framer-page-link-current],span.framer-text[data-framer-page-link-current] span.framer-text:not([dat`
border-radius	`var(--framer-link-hover-text-background-radius,var(--framer-link-current-text-background-radius,var(--framer-link-text-background-radius,initial)))`	`a.framer-text[data-framer-page-link-current]:hover,a.framer-text[data-framer-page-link-current]:hover span.framer-text:not([data-text-fill]),span.framer-text[data-framer-page-link-current]:hover,span.framer-text[data-framer-page-link-current]:hover s`
max-width	`1216px`	`.framer-OAp9l .framer-1aywa82-container,.framer-OAp9l .framer-7t5d04-container`
padding	`0`	`html,body,#main`
padding	`var(--framer-blockquote-text-background-padding,var(--framer-text-background-padding,initial))`	`mark.framer-text,p.framer-text,div.framer-text,h1.framer-text,h2.framer-text,h3.framer-text,h4.framer-text,h5.framer-text,h6.framer-text,li.framer-text,ol.framer-text,ul.framer-text`
padding	`max(0em, calc(calc(1.3em - var(--framer-blockquote-line-height,var(--framer-line-height,1.3em))) / 2))`	`.framer-text[data-text-fill]`
padding	`var(--framer-link-text-background-padding,initial)`	`a.framer-text,a.framer-text span.framer-text:not([data-text-fill]),span.framer-text[data-nested-link],span.framer-text[data-nested-link] span.framer-text:not([data-text-fill])`
padding	`var(--framer-link-hover-text-background-padding,var(--framer-link-text-background-padding,var(--framer-text-background-padding,initial)))`	`a.framer-text:hover,a.framer-text:hover span.framer-text:not([data-text-fill]),span.framer-text[data-nested-link]:hover,span.framer-text[data-nested-link]:hover span.framer-text:not([data-text-fill])`
padding	`var(--framer-link-current-text-background-padding,var(--framer-link-text-background-padding,initial))`	`a.framer-text[data-framer-page-link-current],a.framer-text[data-framer-page-link-current] span.framer-text:not([data-text-fill]),span.framer-text[data-framer-page-link-current],span.framer-text[data-framer-page-link-current] span.framer-text:not([dat`
padding	`var(--framer-link-hover-text-background-padding,var(--framer-link-current-text-background-padding,var(--framer-link-text-background-padding,initial)))`	`a.framer-text[data-framer-page-link-current]:hover,a.framer-text[data-framer-page-link-current]:hover span.framer-text:not([data-text-fill]),span.framer-text[data-framer-page-link-current]:hover,span.framer-text[data-framer-page-link-current]:hover s`
gap	`0`	`.framer-OAp9l.framer-4wvff4`
gap	`40px`	`.framer-OAp9l.framer-17zmjho`
gap	`28px`	`.framer-OAp9l .framer-129eml`
gap	`10px`	`.framer-OAp9l .framer-1pq09l5,.framer-OAp9l .framer-13x2rhs`
gap	`76px`	`.framer-4glZN .framer-abkw5o`
gap	`24px`	`.framer-4glZN .framer-4ke6qx`
gap	`20px`	`.framer-4glZN .framer-5a67k8`
gap	`32px`	`.framer-4glZN .framer-abkw5o`

Evidence and limitations

Values come directly from downloaded stylesheets. Selector context is retained to distinguish elements; individual media-query conditions are not retained.
CSS cascade, active viewport, runtime styles, interactive states and private product UI were not verified. Colors or dimensions in utility classes may be unused on this page.
No inferred dark theme, semantic color roles or framework defaults have been added.
72 custom-property declarations found; 243 relevant property declarations parsed.

Stylesheet sources

https://fiberplane.com/

Fiberplane

Marketing Pages

Product Interfaces

Emails