.webp)
PandaDoc
Effortless eSign Tool
No items found.
No items found.
Visual identity
PandaDoc — design reference
Source: https://www.pandadoc.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: var(--font-graphikl), -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif— selector.style-module**P0jVJa**author .author-avatar+div p:first-childfont-size: 1rem— selector.style-module**P0jVJa**author .author-avatar+div p:first-childfont-size: 1.125rem— selector.style-module**P0jVJa**author .author-avatar+div p:first-childfont-size: .875rem— selector.style-module**P0jVJa**author .author-avatar+div p:last-childfont-size: 2rem— selector.styles-module**QWl0KG**peerTitle :is(p,h1,h2,h3,h4,h5,h6)font-size: 2.625rem— selector.styles-module**QWl0KG**peerTitle :is(p,h1,h2,h3,h4,h5,h6)font-size: var(--text-2xl,1.5rem)— selector.styles-module**QWl0KG**peerTagline :is(p,h1,h2,h3,h4,h5,h6)font-size: 1.5rem— selector.styles-module**QWl0KG**quote :is(p,h1,h2,h3,h4,h5,h6)font-size: .75rem— selector.styles-module**QWl0KG**author p:last-childfont-weight: var(--font-weight-bold,700)— selector.style-module**P0jVJa**author .author-avatar+div p:first-childfont-weight: var(--font-weight-normal,400)— selector.style-module**cLghWW**heroMediaPrimaryContent pfont-weight: var(--font-weight-semibold,600)— selector.style-module**T559zW**card .integration-card**pillfont-weight: var(--font-weight-bold)— selectorh1font-weight: var(--font-weight-semibold)— selector.btn.btn-primary-smallfont-weight: var(--font-weight-normal)— selector.[&_p]:font-normal pline-height: var(--tw-leading,var(--text-base--line-height,calc(1.5 / 1)))— selector.style-moduleP0jVJaauthor .author-avatar+div p:first-childline-height: 1.2— selector.style-moduleP0jVJaauthor .author-avatar+div p:first-childline-height: var(--tw-leading,var(--text-xs--line-height,calc(1 / .75)))— selector.style-moduleP0jVJaauthor .author-avatar+div p:last-childline-height: 1.5— selector.style-moduleP0jVJaauthor .author-avatar+div p:last-childline-height: var(--tw-leading,var(--text-6xl--line-height,1))— selector.styles-moduleQWl0KGpeerTitle :is(p,h1,h2,h3,h4,h5,h6)line-height: var(--tw-leading,var(--text-2xl--line-height,calc(2 / 1.5)))— selector.styles-moduleQWl0KGpeerTagline :is(p,h1,h2,h3,h4,h5,h6)line-height: var(--tw-leading,var(--text-8xl--line-height,1))— selector.style-module1Y3aGqtitle :is(p,h1,h2,h3,h4,h5,h6)line-height: var(--tw-leading,var(--text-8xl--line-height))— selectorh1
Colors and surfaces
color: #248567— selector:is(.styles-moduleQWl0KGpeerTitle,.styles-moduleQWl0KGpeerTagline) acolor: #136a50— selector:is(.styles-moduleQWl0KGpeerTitle,.styles-moduleQWl0KGpeerTagline) a:hovercolor: #242424b3— selector.styles-moduleQWl0KGpeerTagline :is(p,h1,h2,h3,h4,h5,h6)color: #888— selector.styles-moduleQWl0KGauthor p:last-childcolor: #242424!important— selector.style-modulepHFw5qauthor [data-author-type]>div .author-avatar+div p:last-childcolor: lab(14.1977% -.0000149012 .00000596046/.7)— selector.style-moduleYNW4BqheroCustomerStoriesPrimaryContent>pcolor: #242424— selector.style-moduleYNW4BqheroCustomerStoriesPrimaryContent h1,.style-moduleYNW4BqheroCustomerStoriesPrimaryContent h2color: #666— selector.style-module1Y3aGqprimaryContent :is(p,h1,h2,h3,h4,h5,h6,ul,ol)background-color: #242424— selector.CardsCarousal-moduleMt1VqcardsSlider .splidepaginationpagebackground-color: #fff— selector.CardsCarousal-moduleMt1VqcardsSlider[data-dark-background=true] .splidepaginationpagebackground-color: var(--color-white,#fff)— selector.style-moduleYNW4BqheroCustomerStoriesSecondaryContent:afterbackground-color: #6453cf— selector.style-moduleT559zWcard .integration-cardpill.integration-cardpill--newbackground-color: #d5ad15— selector.style-moduleT559zWcard .integration-cardpill.integration-cardpill--premiumbackground-color: #ff523f— selector.style-moduleT559zWcard .integration-cardpill.integration-cardpill--waitlistbackground-color: #f3f5f6— selector.style-moduleT559zWlist li a:hoverbackground-color: #e7ebed— selector.style-moduleT559zWlist li.navigation-list-item--active a
Components and layout
border-radius: 8px— selector.style-moduleR5lvtaheroVideoLargeSecondaryContent [data-embedded-entry=video] .video-containerborder-radius: 2px— selector.style-moduleT559zWcard .integration-cardpillborder-radius: 4px— selector.style-moduleT559zWlist li aborder-radius: 0— selectorbutton,input,select,optgroup,textareaborder-radius: 3.40282e38px— selector.style-module1jT1Zqpost-card .post-cardinfo .post-cardinfo-separatorborder-radius: 0 0 8px 8px— selector.style-moduleqjklhWbannerTabCardbox-shadow: 0 2px 6px #0000001f— selector.style-module1Y3aGqimageWrapper figure>div picturebox-shadow: 0 2px 8px #0000002e— selector.style-moduletLobpWdocumentSections section .container>.templatePageGlobmax-width: 100%— selector.style-modulecLghWWheroMediaPrimaryContent figuremax-width: 200px— selector.style-moduleYNW4BqheroCustomerStoriesPrimaryContent figuremax-width: 250px— selector.style-moduleYNW4BqheroCustomerStoriesPrimaryContent [data-embedded-entry=cta]max-width: 33.33%— selector.style-moduleYNW4BqheroCustomerStoriesPrimaryContent [data-embedded-entry=item-container]:has(.content-item) .content-itemmax-width: 420px— selector.style-moduleYNW4BqheroCustomerStoriesSecondaryContentmax-width: none— selector.style-moduleYNW4BqheroCustomerStoriesSecondaryContentmax-width: 480px— selector.style-moduleYNW4BqheroCustomerStoriesSecondaryContentmax-width: 248px— selector.style-moduleYNW4BqheroCustomerStoriesSecondaryContent figurepadding: calc(var(--spacing,.25rem) \* 0)!important— selector.style-moduleR5lvtaheroVideoLargeSecondaryContent section>.containerpadding: 1.25rem— selector.style-moduleT559zWcard .integration-cardlinkpadding: 9px 2px 10px— selector.Table-moduleB7UdPqrow .btnpadding: 3px 0 0— selector.Table-moduleB7UdPqcellFirst .Table-moduleB7UdPqtooltipButtonpadding: calc(var(--spacing,.25rem) 0)— selector.style-modulelbfNNWtemplatePage section>.containerpadding: 0— selector::file-selector-buttonpadding: calc(var(--spacing) 0)!important— selector.with-fancybox .fancyboxcontainer .has-html .f-html,.with-fancybox .fancyboxcontainer .has-html5video .f-htmlpadding: 1.875rem— selector.styles-moduleFIIXYGformCardgap: 1.25rem— selector.CardsCarousal-moduleM_t1Vq**cardsSlider .splide:not(.is-active) .splide**listgap: 1.875rem— selector.CardsCarousal-module**M\_t1Vq**cardsSlider .splide:not(.is-active) .splide**listgap: calc(var(--spacing,.25rem) _ 1.25)— selector.style-module**YNW4Bq**heroCustomerStoriesPrimaryContent [data-embedded-entry=item-container]:has(.content-item) .content-itemgap: calc(var(--spacing,.25rem) _ 5)— selector.style-module**YNW4Bq**heroCustomerStoriesSecondaryContent [data-embedded-entry=content-item] .content-itemgap: calc(var(--spacing,.25rem) \* 3.75)— selector.style-module**owjneG**heroVideoPrimaryContent [data-embedded-entry=item-container]:has([data-type=cta]) .hero-video-item-containergap: 2.5rem— selector.style-module**T559zW**card.integration-card--featured .integration-card**innergap: .625rem— selector.style-module**T559zW**card.integration-card--featured .integration-card**contentgap: 10px— selector.btn.btn-primary-smalltransition: all .25s— selector.styles-module**FMV01G**UICardContent ul li:beforetransition: color .25s— selector.styles-module**YGK4mq**faqItemTitle h1,.styles-module**YGK4mq**faqItemTitle h2,.styles-module**YGK4mq**faqItemTitle h3,.styles-module**YGK4mq**faqItemTitle h4,.styles-module**YGK4mq**faqItemTitle h5,.styles-module**YGK4mq**faqItemTitle h6,.styles-mo
Responsive rules
(min-width:600px)
(min-width:1200px)
(min-width:960px)
(hover:hover)
(min-width:768px)
(max-width:959px)
(max-width:599px)
(min-width:1400px)
(min-width:96rem)
(prefers-reduced-motion:reduce)
screen and (-ms-high-contrast:none)
not all and (min-width:600px)
(min-width:1540px)
(max-width:479px)
(min-width:480px)
not all and (min-width:599px)
not all and (min-width:767px)
not all and (min-width:959px)
not all and (min-width:1199px)
(min-width:1820px)Source: https://www.pandadoc.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.
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://www.pandadoc.com/\_next/static/immutable/chunks/39j3uc6dk4ytj.css — :root
--header-fixed-height: 60px;
--header-fixed-height: 58px;
--header-fixed-height: 64px;https://www.pandadoc.com/\_next/static/immutable/chunks/3mv06pswhdn4v.css — :root,:host
--font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
--color-red-600: #e40014;
--color-amber-50: #fffbeb;
--color-amber-200: #fee685;
--color-amber-700: #b75000;
--color-amber-900: #7b3306;
--color-blue-500: #3080ff;
--color-purple-600: #9810fa;
--color-gray-50: #f9fafb;
--color-gray-200: #e5e7eb;
--color-gray-300: #d1d5dc;
--color-gray-400: #99a1af;
--color-gray-500: #6a7282;
--color-gray-600: #4a5565;
--color-gray-800: #1e2939;
--color-zinc-50: #fafafa;
--color-zinc-100: #f4f4f5;
--color-zinc-200: #e4e4e7;
--color-zinc-500: #71717b;
--color-zinc-600: #52525c;
--color-zinc-800: #27272a;
--color-zinc-900: #18181b;
--color-neutral-600: #525252;
--color-black: #000;
--color-white: #fff;
--spacing: .25rem;
--text-xs--line-height: calc(1 / .75);
--text-sm--line-height: calc(1.25 / .875);
--text-base--line-height: calc(1.5 / 1);
--text-lg--line-height: calc(1.75 / 1.125);
--text-xl--line-height: calc(1.75 / 1.25);
--text-2xl: 1.5rem;
--text-2xl--line-height: calc(2 / 1.5);
--text-3xl--line-height: calc(2.25 / 1.875);
--text-4xl--line-height: calc(2.5 / 2.25);
--text-5xl--line-height: 1;
--text-6xl--line-height: 1;
--text-8xl--line-height: 1;
--font-weight-normal: 400;
--font-weight-medium: 500;
--font-weight-semibold: 600;
--font-weight-bold: 700;
--tracking-wide: .025em;
--tracking-wider: .05em;
--tracking-widest: .1em;
--leading-tight: 1.25;
--leading-snug: 1.375;
--ease-out: cubic-bezier(0, 0, .2, 1);
--ease-in-out: cubic-bezier(.4, 0, .2, 1);
--animate-spin: spin 1s linear infinite;
--aspect-video: 16 / 9;
--default-transition-duration: .15s;
--default-transition-timing-function: cubic-bezier(.4, 0, .2, 1);
--default-font-family: var(--font-graphikl), -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
--default-mono-font-family: var(--font-mono);
--color-catchy-emerald: #cdded9;
--color-catchy-white: #fff;
--color-bright-emerald: #248567;
--color-bright-coral: #ff826c;
--color-bright-amethyst: #a496ff;
--color-bright-sand: #b2a48c;
--color-core-night: #242424;
--color-core-day: #fff;
--color-core-primary: #248567;
--color-core-primary-dark: #136a50;
--color-core-accent: #6453cf;
--color-border-light: #f3f4f5;
--color-arabic-gray: #888;
--gradient-background: linear-gradient(133deg, #f1e8e3 0%, #d6ceff 50%, #a496ff 100%);
--spacing-3xs: .625rem;
--color-red-600: lab(48.4493% 77.4328 61.5452);
--color-amber-50: lab(98.6252% -.635922 8.42309);
--color-amber-200: lab(91.7203% -.505269 49.9084);
--color-amber-700: lab(47.2709% 42.9082 69.2966);
--color-amber-900: lab(31.2288% 30.2627 40.0378);
--color-blue-500: lab(54.1736% 13.3369 -74.6839);
--color-purple-600: lab(43.0295% 75.21 -86.5669);
--color-gray-50: lab(98.2596% -.247031 -.706708);
--color-gray-200: lab(91.6229% -.159115 -2.26791);
--color-gray-300: lab(85.1236% -.612259 -3.7138);
--color-gray-400: lab(65.9269% -.832707 -8.17473);
--color-gray-500: lab(47.7841% -.393182 -10.0268);
--color-gray-600: lab(35.6337% -1.58697 -10.8425);
--color-gray-800: lab(16.1051% -1.18239 -11.7533);
--color-zinc-50: lab(98.26% 0 0);
--color-zinc-100: lab(96.1634% .0993311 -.364041);
--color-zinc-200: lab(90.6853% .399232 -1.45452);
--color-zinc-500: lab(47.8878% 1.65477 -5.77283);
--color-zinc-600: lab(35.1166% 1.78212 -6.1173);
--color-zinc-800: lab(15.7305% .613764 -2.16959);
--color-zinc-900: lab(8.30603% .618205 -2.16572);
--color-neutral-600: lab(34.924% 0 0);https://www.pandadoc.com/_next/static/immutable/chunks/3mv06pswhdn4v.css — .[--story-ear-fold:var(--color-bright-amethyst)]
--story-ear-fold: var(--color-bright-amethyst);https://www.pandadoc.com/_next/static/immutable/chunks/3mv06pswhdn4v.css — .[--story-ear-fold:var(--color-bright-coral)]
--story-ear-fold: var(--color-bright-coral);https://www.pandadoc.com/_next/static/immutable/chunks/3mv06pswhdn4v.css — .[--story-ear-fold:var(--color-bright-emerald)]
--story-ear-fold: var(--color-bright-emerald);https://www.pandadoc.com/_next/static/immutable/chunks/3mv06pswhdn4v.css — .[--story-ear-fold:var(--color-bright-sand)]
--story-ear-fold: var(--color-bright-sand);https://www.pandadoc.com/_next/static/immutable/chunks/1e4g-jh1daprm.css — .graphikl_11bc4a12-module**jqnxKW**variable
--font-graphikl: "graphikL", "graphikL Fallback";https://www.pandadoc.com/_next/static/immutable/chunks/00g-8ubgohe_p.css — :root
--PhoneInput-color--focus: #03b2cb;
--PhoneInputInternationalIconPhone-opacity: .8;
--PhoneInputInternationalIconGlobe-opacity: .65;
--PhoneInputCountrySelect-marginRight: .35em;
--PhoneInputCountrySelectArrow-width: .3em;
--PhoneInputCountrySelectArrow-marginLeft: var(--PhoneInputCountrySelect-marginRight);
--PhoneInputCountrySelectArrow-borderWidth: 1px;
--PhoneInputCountrySelectArrow-opacity: .45;
--PhoneInputCountrySelectArrow-color: currentColor;
--PhoneInputCountrySelectArrow-color--focus: var(--PhoneInput-color--focus);
--PhoneInputCountrySelectArrow-transform: rotate(45deg);
--PhoneInputCountryFlag-aspectRatio: 1.5;
--PhoneInputCountryFlag-height: 1em;
--PhoneInputCountryFlag-borderWidth: 1px;
--PhoneInputCountryFlag-borderColor: #00000080;
--PhoneInputCountryFlag-borderColor--focus: var(--PhoneInput-color--focus);
--PhoneInputCountryFlag-backgroundColor--loading: #0000001a;Source: https://www.pandadoc.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.
Observed design values, with source selectors. Names shown are CSS properties, not invented official token names.
| Property | Declared value | Selector |
|---|---|---|
| font-family | var(--font-graphikl), -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif | .style-module**P0jVJa**author .author-avatar+div p:first-child |
| font-size | 1rem | .style-module**P0jVJa**author .author-avatar+div p:first-child |
| font-size | 1.125rem | .style-module**P0jVJa**author .author-avatar+div p:first-child |
| font-size | .875rem | .style-module**P0jVJa**author .author-avatar+div p:last-child |
| font-size | 2rem | .styles-module**QWl0KG**peerTitle :is(p,h1,h2,h3,h4,h5,h6) |
| font-size | 2.625rem | .styles-module**QWl0KG**peerTitle :is(p,h1,h2,h3,h4,h5,h6) |
| font-size | var(--text-2xl,1.5rem) | .styles-module**QWl0KG**peerTagline :is(p,h1,h2,h3,h4,h5,h6) |
| font-size | 1.5rem | .styles-module**QWl0KG**quote :is(p,h1,h2,h3,h4,h5,h6) |
| font-size | .75rem | .styles-module**QWl0KG**author p:last-child |
| font-weight | var(--font-weight-bold,700) | .style-module**P0jVJa**author .author-avatar+div p:first-child |
| font-weight | var(--font-weight-normal,400) | .style-module**cLghWW**heroMediaPrimaryContent p |
| font-weight | var(--font-weight-semibold,600) | .style-module**T559zW**card .integration-card**pill |
| font-weight | var(--font-weight-bold) | h1 |
| font-weight | var(--font-weight-semibold) | .btn.btn-primary-small |
| font-weight | var(--font-weight-normal) | .[&_p]:font-normal p |
| line-height | var(--tw-leading,var(--text-base--line-height,calc(1.5 / 1))) | .style-moduleP0jVJaauthor .author-avatar+div p:first-child |
| line-height | 1.2 | .style-moduleP0jVJaauthor .author-avatar+div p:first-child |
| line-height | var(--tw-leading,var(--text-xs--line-height,calc(1 / .75))) | .style-moduleP0jVJaauthor .author-avatar+div p:last-child |
| line-height | 1.5 | .style-moduleP0jVJaauthor .author-avatar+div p:last-child |
| line-height | var(--tw-leading,var(--text-6xl--line-height,1)) | .styles-moduleQWl0KGpeerTitle :is(p,h1,h2,h3,h4,h5,h6) |
| line-height | var(--tw-leading,var(--text-2xl--line-height,calc(2 / 1.5))) | .styles-moduleQWl0KGpeerTagline :is(p,h1,h2,h3,h4,h5,h6) |
| line-height | var(--tw-leading,var(--text-8xl--line-height,1)) | .style-module1Y3aGqtitle :is(p,h1,h2,h3,h4,h5,h6) |
| line-height | var(--tw-leading,var(--text-8xl--line-height)) | h1 |
| color | #248567 | :is(.styles-moduleQWl0KGpeerTitle,.styles-moduleQWl0KGpeerTagline) a |
| color | #136a50 | :is(.styles-moduleQWl0KGpeerTitle,.styles-moduleQWl0KGpeerTagline) a:hover |
| color | #242424b3 | .styles-moduleQWl0KGpeerTagline :is(p,h1,h2,h3,h4,h5,h6) |
| color | #888 | .styles-moduleQWl0KGauthor p:last-child |
| color | #242424!important | .style-modulepHFw5qauthor [data-author-type]>div .author-avatar+div p:last-child |
| color | lab(14.1977% -.0000149012 .00000596046/.7) | .style-moduleYNW4BqheroCustomerStoriesPrimaryContent>p |
| color | #242424 | .style-moduleYNW4BqheroCustomerStoriesPrimaryContent h1,.style-moduleYNW4BqheroCustomerStoriesPrimaryContent h2 |
| color | #666 | .style-module1Y3aGqprimaryContent :is(p,h1,h2,h3,h4,h5,h6,ul,ol) |
| background-color | #242424 | .CardsCarousal-moduleMt1VqcardsSlider .splidepaginationpage |
| background-color | #fff | .CardsCarousal-moduleMt1VqcardsSlider[data-dark-background=true] .splidepaginationpage |
| background-color | var(--color-white,#fff) | .style-moduleYNW4BqheroCustomerStoriesSecondaryContent:after |
| background-color | #6453cf | .style-moduleT559zWcard .integration-cardpill.integration-cardpill--new |
| background-color | #d5ad15 | .style-moduleT559zWcard .integration-cardpill.integration-cardpill--premium |
| background-color | #ff523f | .style-moduleT559zWcard .integration-cardpill.integration-cardpill--waitlist |
| background-color | #f3f5f6 | .style-moduleT559zWlist li a:hover |
| background-color | #e7ebed | .style-moduleT559zWlist li.navigation-list-item--active a |
| border-radius | 8px | .style-moduleR5lvtaheroVideoLargeSecondaryContent [data-embedded-entry=video] .video-container |
| border-radius | 2px | .style-moduleT559zWcard .integration-cardpill |
| border-radius | 4px | .style-moduleT559zWlist li a |
| border-radius | 0 | button,input,select,optgroup,textarea |
| border-radius | 3.40282e38px | .style-module1jT1Zqpost-card .post-cardinfo .post-cardinfo-separator |
| border-radius | 0 0 8px 8px | .style-moduleqjklhWbannerTabCard |
| box-shadow | 0 2px 6px #0000001f | .style-module1Y3aGqimageWrapper figure>div picture |
| box-shadow | 0 2px 8px #0000002e | .style-moduletLobpWdocumentSections section .container>.templatePageGlob |
| max-width | 100% | .style-modulecLghWWheroMediaPrimaryContent figure |
| max-width | 200px | .style-moduleYNW4BqheroCustomerStoriesPrimaryContent figure |
| max-width | 250px | .style-moduleYNW4BqheroCustomerStoriesPrimaryContent [data-embedded-entry=cta] |
| max-width | 33.33% | .style-moduleYNW4BqheroCustomerStoriesPrimaryContent [data-embedded-entry=item-container]:has(.content-item) .content-item |
| max-width | 420px | .style-moduleYNW4BqheroCustomerStoriesSecondaryContent |
| max-width | none | .style-moduleYNW4BqheroCustomerStoriesSecondaryContent |
| max-width | 480px | .style-moduleYNW4BqheroCustomerStoriesSecondaryContent |
| max-width | 248px | .style-moduleYNW4BqheroCustomerStoriesSecondaryContent figure |
| padding | calc(var(--spacing,.25rem) \* 0)!important | .style-moduleR5lvtaheroVideoLargeSecondaryContent section>.container |
| padding | 1.25rem | .style-moduleT559zWcard .integration-cardlink |
| padding | 9px 2px 10px | .Table-moduleB7UdPqrow .btn |
| padding | 3px 0 0 | .Table-moduleB7UdPqcellFirst .Table-moduleB7UdPqtooltipButton |
| padding | calc(var(--spacing,.25rem) 0) | .style-modulelbfNNWtemplatePage section>.container |
| padding | 0 | ::file-selector-button |
| padding | calc(var(--spacing) 0)!important | .with-fancybox .fancyboxcontainer .has-html .f-html,.with-fancybox .fancyboxcontainer .has-html5video .f-html |
| padding | 1.875rem | .styles-moduleFIIXYGformCard |
| gap | 1.25rem | .CardsCarousal-moduleM_t1Vq**cardsSlider .splide:not(.is-active) .splide**list |
| gap | 1.875rem | .CardsCarousal-module**M\_t1Vq**cardsSlider .splide:not(.is-active) .splide**list |
| gap | calc(var(--spacing,.25rem) _ 1.25) | .style-module**YNW4Bq**heroCustomerStoriesPrimaryContent [data-embedded-entry=item-container]:has(.content-item) .content-item |
| gap | calc(var(--spacing,.25rem) _ 5) | .style-module**YNW4Bq**heroCustomerStoriesSecondaryContent [data-embedded-entry=content-item] .content-item |
| gap | calc(var(--spacing,.25rem) \* 3.75) | .style-module**owjneG**heroVideoPrimaryContent [data-embedded-entry=item-container]:has([data-type=cta]) .hero-video-item-container |
| gap | 2.5rem | .style-module**T559zW**card.integration-card--featured .integration-card**inner |
| gap | .625rem | .style-module**T559zW**card.integration-card--featured .integration-card**content |
| gap | 10px | .btn.btn-primary-small |
| transition | all .25s | .styles-module**FMV01G**UICardContent ul li:before |
| transition | color .25s | .styles-module**YGK4mq**faqItemTitle h1,.styles-module**YGK4mq**faqItemTitle h2,.styles-module**YGK4mq**faqItemTitle h3,.styles-module**YGK4mq**faqItemTitle h4,.styles-module**YGK4mq**faqItemTitle h5,.styles-module**YGK4mq**faqItemTitle h6,.styles-mo |
Source: https://www.pandadoc.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.
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.
- 117 custom-property declarations found; 4353 relevant property declarations parsed.
Stylesheet sources
- https://www.pandadoc.com/_next/static/immutable/chunks/39j3uc6dk4ytj.css
- https://www.pandadoc.com/_next/static/immutable/chunks/3mv06pswhdn4v.css
- https://www.pandadoc.com/_next/static/immutable/chunks/1g0l9jy1wdzup.css
- https://www.pandadoc.com/_next/static/immutable/chunks/1e4g-jh1daprm.css
- https://www.pandadoc.com/_next/static/immutable/chunks/1yz1seweu714n.css
- https://www.pandadoc.com/_next/static/immutable/chunks/00g-8ubgohe_p.css
- https://www.pandadoc.com/_next/static/immutable/chunks/2o-9d6bqo-qjo.css