Fast Tags | How to personalize using CSS

You want to modify Fast Tags? If you or your team is at ease with code, you can leverage CSS (Cascading Style Sheets) to edit the Fast Tags look. This article is specifically designed for a developer audience🧑‍💻

You can simply add your own CSS into the code of your product page.

Below is an example showcasing modifications one of our merchants implemented. In this example, they modified the width, icon color, background color of the tag, and more. To apply these changes to your product page, simply inject the following style into your product page's CSS code:

/* Main container */
.bb-tag-root {
background-color: rgba(0, 0, 0, 0.025);
width: 100%;
}
/* Icon color /      / Main text */
.bb-tag-root svg path, bigblue span > span {
fill: #c39884;
}
/* Hide the postcode edition — NOT RECOMMENDED */
.bb-tag-root div > div:has(form) {
display: none;
}

Disclaimers

• You can use this style to customize both the background and colors within your page. We recommend making sure the Fast Tags are prominently displayed on your page so that buyers do not overlook your delivery reassurance tag.
• We advise against hiding some sub-components of Fast Tags
  • It was designed to push the best argument to instill trust in your delivery speed.
  • While some brands asked us to remove the postal code edition, we highly advise against it. A lot of customers are shopping in their commute or at work for a home delivery.
• Our product team might make some Fast Tags improvements in the future. If we change the nomenclature of components, you may have to re-apply your edits.

We do not yet have a method that allows you to only retrieve a date or a date range. However, we regularly enhance the functionality to make it more efficient, and these improvements are in our potential list of improvements. Please contact us if you want to only use an endpoint for the estimated date.