Here you find a lot of snippets you can use to reproduce similar results of components in your web shop.

Please be aware that some of these are paid upgrades and you are only allowed to use them if you paid the upgrade. Please contact your customer success contact to find out more.

Examples

Each component is defined by the specific HTML tag and is digesting additionally a style-customization attributes on the tag. Have a look at examples:

The cards

<retraced-cards></retraced-cards>

The cards cornered

<retraced-cards style-customization='{"isRounded":false}'></retraced-cards>

Icons with description

<retraced-icons-with-description></retraced-icons-with-description >

All components

Type

Tag

Cards

<retraced-cards/>

Icons

<retraced-icons/>

Icons with description

<retraced-icons-with-description/>

Rounded verified button

<retraced-button-verified/>

Transprency report button

<retraced-button-transparency-report/>

All customizations

The premium features 💎 must be paid for as part of your subscription. Please check with your customer success manager which components you are allowed to use.

Component

Change

style-customization

Premium feature?

Cards

Whitelabeled

"hasBranding": false

💎

Cards

Cornered

"isRounded": false

Cards

round

Icons

Whitelabeled

"hasBranding": false

💎

Icons

Custom font coloring. Any hex code.

"fontColor": "#28526B"

💎

Icons w/ description

Fallback to your page font

"useRetracedFont": false

💎

Icons w/ description

Custom font coloring. Any hex code.

"fontColor": "#28526B"

💎

Button transparency report

Did this answer your question?