Documentation Parcelify Storefront Shipping Rates Theme Integrations

Theme Integrations

Here we will cover some of the properties you can update to change the style of your Storefront Shipping rates

Customizing Colors

You can customize the accent colors of the customer information and rate selection dialogs by adding custom CSS variables to your Shopify theme.

Color Reference

There are three customizable accent colors - the default color plus lighter and darker variations.

Updating Your Theme

To customize these colors, simply add or change the following CSS variables to your theme.liquid layout file.

{% style %}
  :root {
    --parcelify-primary-color: #bf94e4; /* default */
    --parcelify-primary-color-lighter: #DDC2F4; /* lighter */
    --parcelify-primary-color-darker: #A06BCD; /* darker */
  }
{% endstyle %}