How to style a paywall

false

How to style a paywall

Last updated March 06, 2026 13:56

Customize your paywall to fit your blog page, course, member site, or videos page aesthetic.

Visitors to your site use your paywall to sign up for your pricing plan. You can style your paywall to match your site's design using style themes and tweaks. This guide covers what appears on your paywall and how to make style changes to your paywall.

Paywall structure

The paywall includes the following details:

  • Headline - Create a headline for the screen, stating the name of the digital product and welcoming your members.
  • Description - Use this field to remind visitors that content is only accessible to members of your pricing plan.
  • Log in link - Members click this button to sign into their customer account and access their digital products.
  • Pricing plans - Display the pricing plans that include the course, blog, videos page, or member site. Visitors can review the available pricing plans and sign up to gain access.

When logged into your site and editing your paywall, it's not possible to click the log in or sign up buttons. To test the buttons on your paywall, visit your site in a separate private browsing window.

Squarespace paywall with two pricing plans and login button

Style your paywall

You can adjust the style of your paywall to match your site’s design or content theme. How you style the paywall depends on your site’s version.

Colors

To style the paywall’s colors in version 7.1, open site styles, then click Colors. The paywall uses the default color theme. Click the theme to make style changes:

  • Headline color - Follows Heading (large)
  • Description color - Follows Paragraph (medium)
  • Pricing option picker color - Follows Background under Button
  • Pricing option picker font color - Follows Text under Button
  • Button color - Follows Background under Button
  • Button font color - Follows Text under Button
  • Sign In link color - Follows Paragraph (medium)

Text

All text elements on the paywall take their style from your site-wide fonts. You can re-size the paywall’s fonts using the following tweaks:

  • Headline size - Follows Heading 2
  • Description size - Follows Paragraph 2
  • Pricing option picker font size - Follows your font’s Base Size.
  • Button font size - Follows your font’s Base Size.
  • Sign In link font size - Follows Paragraph 2

To learn more about button style tweaks, visit Styling buttons.

To style the paywall in version 7.0, open the paywall you want to customize, then open site styles to find the following style tweaks:

  • Headline font - Follows Heading 2
  • Headline color - Follows Heading 2
  • Description font - Follows Body text
  • Description color - Follows Body text
  • Button font - Follows Font under Buttons
  • Button color - Follows Button color under Buttons
  • Button shape - Follows Shape under Buttons
  • Button style - Follows Style under Buttons

To learn more about button style tweaks in version 7.0, visit Styling buttons.

Was this article helpful?

Yes No

0 out of 0 found this helpful

Yes No

How to style a paywall