Ecommerce

Contextual color

We have a series of colors that are used by default and you can use these helper classes for most components

State Postfix
Primary *-primary
Secondary *-secondary
Success *-success
Info *-info
Warning *-warning
Danger *-danger
Pink *-pink
Light *-light
Dark *-dark

For each color has its functionality in application as main color of application (primary) or warnings to user (warning)

Examples

Text

Use text-{color} to applying contextual color to text

primary primary-emphasis secondary secondary-emphasis success success-emphasis info info-emphasis warning warning-emphasis danger danger-emphasis pink pink-emphasis text-body text-body-emphasis text-body-secondary text-body-tertiary text-black text-black-50 text-white text-white-50

Background

Use bg-{color} to applying contextual color to background

Primary Primary-subtle Secondary Secondary-subtle Success Success-subtle Info Info-subtle Warning Warning-subtle Danger Danger-subtle Pink Pink-subtle Light Light-subtle Dark Dark-subtle Body Body-tertiary White Black Transparent