Skip to documentation

Buttons and hover effects

Use shared button styles and scoped custom overrides.

Overview

Style selects the button treatment; color source selects where its colors come from. Independent CTAs can have independent block settings.

Step by step

  1. Choose a supported Primary, Secondary, Tertiary, Featured, Link or Custom style for the CTA.
  2. Use the color source to follow theme colors, a Shopify scheme or local manual controls.
  3. Global optional shine, bottom depth and shadow controls affect supported button styles. Tertiary retains its own effect settings.
  4. Check hover, keyboard focus and text contrast. Reduced-motion preferences limit decorative motion.

Still need a hand?

Send support your store domain, theme version, error code and what you tried. Keep authentication tokens out of public messages.

Contact Scale support ↗