Overview

Flits Wishlist buttons can be fully styled to match your theme’s look and feel. You can control colors, spacing, font settings, border radius, and overall hierarchy to ensure the button fits seamlessly into your PDP (Product Detail Page), collection card, and wishlist page.

1. Button Color Settings

You can configure:

  • Button Background Color

  • Text Color

  • Hover Color

  • Icon Color

  • Active State Color

Best practices:

  • Use your brand’s primary or secondary color for visibility

  • Ensure contrast meets accessibility guidelines (WCAG)

2. Border Radius

Controls the roundness of button corners:

  • 0px (sharp edges) → modern/minimal

  • 4–6px → Shopify-standard look

  • 20+ px → pill-shaped buttons

3. Padding & Spacing

Adjust:

  • Padding X → horizontal button size

  • Padding Y → vertical button size

  • Spacing from top → distance between wishlist button and nearby UI elements

Common use cases:

  • Increase top spacing to separate from Add to Cart

  • Reduce padding for minimal designs

4. Button Style: Solid vs Outline

  • Solid → high-visibility CTA style

  • Outline → subtle, secondary-action feel

Choose based on your brand’s hierarchy.

5. Inheriting Theme Fonts

Enable Use Shopify Theme Font to automatically match your store typography. If not setup Flits' default fonts will appear.


For assistance or additional information on the Wishlist App, our team is available at support@getflits.com.