Pricing

All your sales and support in one widget

Customer Support13 Websites1 Products9 sections
Search Acquire screensVisit website

Websites 13

All websites
Pro10 more websites from AcquireUnlock every screen, flow and Figma design with SaaSFrame Pro.See plans
Index of all 13 Acquire websites examples

Products 1

All products

Website sections 9

SaaSFrame Pro

Unlock 6 more Acquire sections

Free accounts see three sections per page. Pro unlocks every section, screen and flow, plus Copy in Figma.

Get Pro Log in

Design reference

Acquire — design reference

Source: https://acquire.io/. 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: Arial, sans-serif — selector body
  • font-family: Volkart, Verdana, sans-serif — selector body
  • font-family: Matter, sans-serif — selector .text-rich-text-large h6
  • font-size: 100% — selector :root
  • font-size: clamp(100%, 1.1vw, 125%) — selector :root
  • font-size: 6.375rem — selector .text-rich-text blockquote:before, .text-rich-text-large blockquote:before
  • font-size: 5.5rem — selector .text-rich-text-large blockquote:before, .text-rich-text blockquote:before
  • font-size: 2em — selector h1
  • font-size: 1em — selector code, kbd, pre, samp
  • font-size: 14px — selector body
  • font-size: 38px — selector h1
  • font-weight: 300 — selector .text-rich-text blockquote:before, .text-rich-text-large blockquote:before
  • font-weight: bold — selector h1, h2, h3, h4, h5, h6
  • font-weight: 500 — selector h1
  • font-weight: 600 — selector .text-weight-semibold
  • font-weight: 700 — selector .text-rich-text-large strong
  • font-weight: 400 — selector .text-weight-normal
  • font-weight: 800 — selector .text-weight-xbold
  • line-height: 1 — selector .text-rich-text blockquote:before, .text-rich-text-large blockquote:before
  • line-height: 20px — selector body
  • line-height: 44px — selector h1
  • line-height: 36px — selector h2
  • line-height: 30px — selector h3
  • line-height: 24px — selector h4
  • line-height: 18px — selector h6
  • letter-spacing: 0.02em — selector .text-rich-text blockquote:before, .text-rich-text-large blockquote:before
  • letter-spacing: -.028em — selector h1
  • letter-spacing: -.02em — selector h2
  • letter-spacing: -.015em — selector h5
  • letter-spacing: -.011em — selector h6
  • letter-spacing: .02em — selector .text-rich-text-large h6
  • letter-spacing: -.04em — selector .text-block

Colors and surfaces

  • color: white — selector .text-rich-text-large blockquote strong
  • color: #8af135 — selector .text-rich-text blockquote:before, .text-rich-text-large blockquote:before
  • color: #333 — selector body
  • color: var(--body--dark) — selector body
  • background-color: #4caf50 — selector .custom-button
  • background-color: #45a049 — selector .custom-button:hover
  • background-color: #0000 — selector a
  • background-color: #fff — selector body

Components and layout

  • border-radius: 8px — selector .video-container
  • border-radius: 6px — selector .custom-button
  • border-radius: .65625rem — selector .email-animation_dark-text-wrapper
  • box-shadow: 0 4px 1rem 0 #3c4f511a — selector .platform-card_component
  • box-shadow: 0 6px 2rem #2a393a33 — selector .home-hero-mockup
  • box-shadow: 0 4px 1rem #3c4f511a — selector .content-card_component.has-hover:hover
  • box-shadow: 0 -10px 1.25rem #2a393a33 — selector .home-hero-mockup
  • max-width: 48rem — selector .container-small
  • max-width: 29.5rem — selector .text-size-regular.max-w-20
  • max-width: 42.875rem — selector .text-size-regular.max-w-680
  • max-width: 30rem — selector .heading-style-h4.max-w--480
  • padding: 10px 18px — selector .custom-button
  • padding: 0 — selector button::-moz-focus-inner, input::-moz-focus-inner
  • padding: 6.4rem 4rem 5rem — selector .text-rich-text-large blockquote
  • padding: 0 1.25rem — selector .text-style-quote
  • transition: background 0.2s ease — selector .custom-button
  • transition: color .1s — selector .text-rich-text-large a
  • transition: background-color .2s — selector .button-dark
  • transition: color .2s — selector .text-link-dark
  • transition: color .2s, background-color .2s — selector .button-outlined
  • transition: transform .2s, box-shadow .2s — selector .content-card_component.has-hover
  • transition: border .2s, background-color .2s — selector .button-white
  • transition: opacity .2s — selector .content_card_image-border

Responsive rules

(min-width: 992px) 
(max-width: 991px) and (min-width: 768px) 
screen and (max-width: 991px),
                    screen and (max-width: 767px),
                    screen and (max-width: 479px) 
screen and (max-width: 767px) 
screen and (min-width: 1440px) 
screen and (max-width: 991px) 
screen and (min-width: 991px) 
screen and (max-width: 479px) 
(min-width: 768px)

Tech stack