


Source: https://www.vidzflow.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.
font-family: Arial, sans-serif โ selector bodyfont-family: Satoshi, sans-serif โ selector bodyfont-size: 2em โ selector h1font-size: 1em โ selector code, kbd, pre, sampfont-size: 14px โ selector bodyfont-size: 38px โ selector h1font-size: 32px โ selector h2font-size: 24px โ selector h3font-size: 18px โ selector h4font-size: 12px โ selector h6font-weight: bold โ selector h1, h2, h3, h4, h5, h6font-weight: 500 โ selector bodyfont-weight: 600 โ selector h1font-weight: 400 โ selector h4font-weight: 700 โ selector .display-heading-1line-height: 20px โ selector bodyline-height: 44px โ selector h1line-height: 36px โ selector h2line-height: 30px โ selector h3line-height: 24px โ selector h4line-height: 18px โ selector h6line-height: 48px โ selector h1letter-spacing: -.02em โ selector h1letter-spacing: -.01em โ selector h3letter-spacing: 0 โ selector h4color: #333 โ selector bodycolor: #ffffff80 โ selector bodycolor: var(--gray-1) โ selector h1color: var(--primary-6) โ selector .card-heading.text-primary-6background-color: #0000 โ selector abackground-color: #fff โ selector bodybackground-color: #141c27 โ selector bodyborder-radius: 16px โ selector .panel.section.bg-gradient-1.no-outline.footer-ctaborder-radius: 6px โ selector .button-outlineborder-radius: 50% โ selector .button-circle-smallborder-radius: 12px โ selector .hero-bg-1border-radius: 15px โ selector .small-cardborder-radius: 8px โ selector .video-containerborder-radius: 4px โ selector .quality-container_popupbox-shadow: inset 0 0 20px 20px #0000 โ selector .button-smallbox-shadow: inset 0 0 20px 20px #0000001a โ selector .button-small:hoverbox-shadow: 0 12px 12px #0003 โ selector .fixed-notice-containerbox-shadow: 0 20px 30px -15px #1d01501a โ selector .small-cardbox-shadow: 0 0 5px 1px #0003 โ selector .video-containermax-width: 1296px โ selector .containermax-width: 1642px โ selector .container.stars-containermax-width: 612px โ selector .rounded-image.section-title-imagemax-width: 820px โ selector .display-heading-4.no-bottom-space.max-widthpadding: 0 โ selector button::-moz-focus-inner, input::-moz-focus-innerpadding: 64px 64px 48px 32px โ selector .card_stackpadding: 32px โ selector .customer_heropadding: 60px 32px โ selector .hero-display-item.is-homepagetransition: border-color .2s โ selector .button-outlinetransition: box-shadow .2s โ selector .button-smalltransition: border-width .2s, border-color .2s, background-color .2s โ selector .radio-buttontransition: opacity .2s โ selector .nav-linktransition: color .2s, background-color .2s โ selector .card_stack.tab-paneltransition: background-color .2s โ selector .card_stack.job-listing-list-itemtransition: all .2s โ selector .quality-container_popup-item-textscreen and (max-width: 991px)
screen and (max-width: 767px)
screen and (max-width: 479px)
(min-width: 768px)
screen and (min-width: 1920px)
Source: https://www.vidzflow.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://cdn.prod.website-files.com/6424a84a1a90881fe7724044/css/vidzflow.shared.2afc9a3a0.css โ :root
--gray-1: #141c27;
--gray-2: #ffffff14;
--white: white;
--primary-1: #4e5ffd;
--primary-2: #43c9e4;
--primary-3: #ffca01;
--primary-4: #3444d8;
--primary-5: #6977f8;
--gray-3: #1e2939;
--primary-6: #51ed39;
--gray-4: #ffffff80;
--black: black;https://cdn.prod.website-files.com/6424a84a1a90881fe7724044/css/vidzflow.shared.2afc9a3a0.css โ [data-w-mode--base="base"]
--gray-1: #141c27 !important;
--gray-2: #ffffff14 !important;
--white: white !important;
--primary-1: #4e5ffd !important;
--primary-2: #43c9e4 !important;
--primary-3: #ffca01 !important;
--primary-4: #3444d8 !important;
--primary-5: #6977f8 !important;
--gray-3: #1e2939 !important;
--primary-6: #51ed39 !important;
--gray-4: #ffffff80 !important;
--black: black !important;https://cdn.prod.website-files.com/6424a84a1a90881fe7724044/css/vidzflow.shared.2afc9a3a0.css โ [data-w-mode--base="inherit"]
--gray-1: inherit !important;
--gray-2: inherit !important;
--white: inherit !important;
--primary-1: inherit !important;
--primary-2: inherit !important;
--primary-3: inherit !important;
--primary-4: inherit !important;
--primary-5: inherit !important;
--gray-3: inherit !important;
--primary-6: inherit !important;
--gray-4: inherit !important;
--black: inherit !important;
Source: https://www.vidzflow.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 | Arial, sans-serif | body |
| font-family | Satoshi, sans-serif | body |
| font-size | 2em | h1 |
| font-size | 1em | code, kbd, pre, samp |
| font-size | 14px | body |
| font-size | 38px | h1 |
| font-size | 32px | h2 |
| font-size | 24px | h3 |
| font-size | 18px | h4 |
| font-size | 12px | h6 |
| font-weight | bold | h1, h2, h3, h4, h5, h6 |
| font-weight | 500 | body |
| font-weight | 600 | h1 |
| font-weight | 400 | h4 |
| font-weight | 700 | .display-heading-1 |
| line-height | 20px | body |
| line-height | 44px | h1 |
| line-height | 36px | h2 |
| line-height | 30px | h3 |
| line-height | 24px | h4 |
| line-height | 18px | h6 |
| line-height | 48px | h1 |
| letter-spacing | -.02em | h1 |
| letter-spacing | -.01em | h3 |
| letter-spacing | 0 | h4 |
| color | #333 | body |
| color | #ffffff80 | body |
| color | var(--gray-1) | h1 |
| color | var(--primary-6) | .card-heading.text-primary-6 |
| background-color | #0000 | a |
| background-color | #fff | body |
| background-color | #141c27 | body |
| border-radius | 16px | .panel.section.bg-gradient-1.no-outline.footer-cta |
| border-radius | 6px | .button-outline |
| border-radius | 50% | .button-circle-small |
| border-radius | 12px | .hero-bg-1 |
| border-radius | 15px | .small-card |
| border-radius | 8px | .video-container |
| border-radius | 4px | .quality-container_popup |
| box-shadow | inset 0 0 20px 20px #0000 | .button-small |
| box-shadow | inset 0 0 20px 20px #0000001a | .button-small:hover |
| box-shadow | 0 12px 12px #0003 | .fixed-notice-container |
| box-shadow | 0 20px 30px -15px #1d01501a | .small-card |
| box-shadow | 0 0 5px 1px #0003 | .video-container |
| max-width | 1296px | .container |
| max-width | 1642px | .container.stars-container |
| max-width | 612px | .rounded-image.section-title-image |
| max-width | 820px | .display-heading-4.no-bottom-space.max-width |
| padding | 0 | button::-moz-focus-inner, input::-moz-focus-inner |
| padding | 64px 64px 48px 32px | .card_stack |
| padding | 32px | .customer_hero |
| padding | 60px 32px | .hero-display-item.is-homepage |
| transition | border-color .2s | .button-outline |
| transition | box-shadow .2s | .button-small |
| transition | border-width .2s, border-color .2s, background-color .2s | .radio-button |
| transition | opacity .2s | .nav-link |
| transition | color .2s, background-color .2s | .card_stack.tab-panel |
| transition | background-color .2s | .card_stack.job-listing-list-item |
| transition | all .2s | .quality-container_popup-item-text |
Source: https://www.vidzflow.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.