Cartzilla component

Icons

Collection of vector icons in the format of font. Respective CSS class is listed under each icon.

UI icons

ci-activity

<i class="ci-activity"></i>

ci-airplay

<i class="ci-airplay"></i>

ci-alert-circle

<i class="ci-alert-circle"></i>

ci-alert-octagon

<i class="ci-alert-octagon"></i>

ci-alert-triangle

<i class="ci-alert-triangle"></i>

ci-align-center

<i class="ci-align-center"></i>

ci-align-justify

<i class="ci-align-justify"></i>

ci-align-left

<i class="ci-align-left"></i>

ci-align-right

<i class="ci-align-right"></i>

ci-anchor

<i class="ci-anchor"></i>

ci-aperture

<i class="ci-aperture"></i>

ci-archive

<i class="ci-archive"></i>

ci-arrow-down-circle

<i class="ci-arrow-down-circle"></i>

ci-arrow-down-left

<i class="ci-arrow-down-left"></i>

ci-arrow-down-right

<i class="ci-arrow-down-right"></i>

ci-arrow-down

<i class="ci-arrow-down"></i>

ci-arrow-left-circle

<i class="ci-arrow-left-circle"></i>

ci-arrow-left

<i class="ci-arrow-left"></i>

ci-arrow-right-circle

<i class="ci-arrow-right-circle"></i>

ci-arrow-right

<i class="ci-arrow-right"></i>

ci-arrow-up-circle

<i class="ci-arrow-up-circle"></i>

ci-arrow-up-left

<i class="ci-arrow-up-left"></i>

ci-arrow-up-right

<i class="ci-arrow-up-right"></i>

ci-arrow-up

<i class="ci-arrow-up"></i>

ci-at-sign

<i class="ci-at-sign"></i>

ci-autocontrast

<i class="ci-auto"></i>

ci-avocado

<i class="ci-avocado"></i>

ci-award

<i class="ci-award"></i>

ci-bannedforbidden

<i class="ci-banned"></i>

ci-bar-chart

<i class="ci-bar-chart"></i>

ci-bar-chart-2

<i class="ci-bar-chart-2"></i>

ci-battery

<i class="ci-battery"></i>

ci-battery-charging

<i class="ci-battery-charging"></i>

ci-battery-2

<i class="ci-battery-2"></i>

ci-bellnotification

<i class="ci-bell"></i>

ci-bell-offnotification

<i class="ci-bell-off"></i>

ci-bluetooth

<i class="ci-bluetooth"></i>

ci-bold

<i class="ci-bold"></i>

ci-book

<i class="ci-book"></i>

ci-book-open

<i class="ci-book-open"></i>

ci-bookmark

<i class="ci-bookmark"></i>

ci-box

<i class="ci-box"></i>

ci-briefcase

<i class="ci-briefcase"></i>

ci-broccoli

<i class="ci-broccoli"></i>

ci-bullet

<i class="ci-bullet"></i>

ci-calendardate

<i class="ci-calendar"></i>

ci-camera

<i class="ci-camera"></i>

ci-camera-off

<i class="ci-camera-off"></i>

ci-camera-2

<i class="ci-camera-2"></i>

ci-cast

<i class="ci-cast"></i>

ci-chat

<i class="ci-chat"></i>

ci-check

<i class="ci-check"></i>

ci-check-circle

<i class="ci-check-circle"></i>

ci-check-shield

<i class="ci-check-shield"></i>

ci-check-square

<i class="ci-check-square"></i>

ci-chevron-down

<i class="ci-chevron-down"></i>

ci-chevron-left

<i class="ci-chevron-left"></i>

ci-chevron-right

<i class="ci-chevron-right"></i>

ci-chevron-up

<i class="ci-chevron-up"></i>

ci-chevrons-down

<i class="ci-chevrons-down"></i>

ci-chevrons-left

<i class="ci-chevrons-left"></i>

ci-chevrons-right

<i class="ci-chevrons-right"></i>

ci-clipboard

<i class="ci-clipboard"></i>

ci-clocktime

<i class="ci-clock"></i>

ci-cloud

<i class="ci-cloud"></i>

ci-cloud-off

<i class="ci-cloud-off"></i>

ci-cloud-drizzle

<i class="ci-cloud-drizzle"></i>

ci-cloud-lightning

<i class="ci-cloud-lightning"></i>

ci-cloud-rain

<i class="ci-cloud-rain"></i>

ci-cloud-snow

<i class="ci-cloud-snow"></i>

ci-code

<i class="ci-code"></i>

ci-coffee

<i class="ci-coffee"></i>

ci-columns

<i class="ci-columns"></i>

ci-command

<i class="ci-command"></i>

ci-compass

<i class="ci-compass"></i>

ci-computerlaptop

<i class="ci-computer"></i>

ci-copy

<i class="ci-copy"></i>

ci-corner-down-leftarrow

<i class="ci-corner-down-left"></i>

ci-corner-down-rightarrow

<i class="ci-corner-down-right"></i>

ci-corner-left-downarrow

<i class="ci-corner-left-down"></i>

ci-corner-left-uparrow

<i class="ci-corner-left-up"></i>

ci-corner-right-downarrow

<i class="ci-corner-right-down"></i>

ci-corner-right-uparrow

<i class="ci-corner-right-up"></i>

ci-corner-up-leftarrow

<i class="ci-corner-up-left"></i>

ci-corner-up-rightarrow

<i class="ci-corner-up-right"></i>

ci-credit-card

<i class="ci-credit-card"></i>

ci-crop

<i class="ci-crop"></i>

ci-crosshairaim

<i class="ci-crosshair"></i>

ci-database

<i class="ci-database"></i>

ci-deletebackspace

<i class="ci-delete"></i>

ci-deliverytruck car

<i class="ci-delivery"></i>

ci-delivery-2truck car

<i class="ci-delivery-2"></i>

ci-disc

<i class="ci-disc"></i>

ci-divide

<i class="ci-divide"></i>

ci-dollar-sign

<i class="ci-dollar-sign"></i>

ci-download

<i class="ci-download"></i>

ci-download-cloud

<i class="ci-download-cloud"></i>

ci-droplet

<i class="ci-droplet"></i>

ci-edit

<i class="ci-edit"></i>

ci-edit-2

<i class="ci-edit-2"></i>

ci-edit-3

<i class="ci-edit-3"></i>

ci-external-link

ci-eye

<i class="ci-eye"></i>

ci-eye-off

<i class="ci-eye-off"></i>

ci-fast-forward

<i class="ci-fast-forward"></i>

ci-feather

<i class="ci-feather"></i>

ci-file

<i class="ci-file"></i>

ci-file-minus

<i class="ci-file-minus"></i>

ci-file-plus

<i class="ci-file-plus"></i>

ci-file-text

<i class="ci-file-text"></i>

ci-film

<i class="ci-film"></i>

ci-filter

<i class="ci-filter"></i>

ci-flag

<i class="ci-flag"></i>

ci-folder

<i class="ci-folder"></i>

ci-folder-minus

<i class="ci-folder-minus"></i>

ci-folder-plus

<i class="ci-folder-plus"></i>

ci-foodmeal cook

<i class="ci-food"></i>

ci-frownemoji sad

<i class="ci-frown"></i>

ci-game

<i class="ci-game"></i>

ci-gift

<i class="ci-gift"></i>

ci-globe

<i class="ci-globe"></i>

ci-gluten-free

<i class="ci-gluten-free"></i>

ci-grid

<i class="ci-grid"></i>

ci-hangerhanger

<i class="ci-hanger"></i>

ci-hard-drive

<i class="ci-hard-drive"></i>

ci-hard-drive-2

<i class="ci-hard-drive-2"></i>

ci-hash

<i class="ci-hash"></i>

ci-headphones

<i class="ci-headphones"></i>

ci-headphones-2

<i class="ci-headphones-2"></i>

ci-heart

<i class="ci-heart"></i>

ci-heart-filled

<i class="ci-heart-filled"></i>

ci-help-circle

<i class="ci-help-circle"></i>

ci-home

<i class="ci-home"></i>

ci-id-cardpassport

<i class="ci-id-card"></i>

ci-imagepicture photo

<i class="ci-image"></i>

ci-inbox

<i class="ci-inbox"></i>

ci-info

<i class="ci-info"></i>

ci-italic

<i class="ci-italic"></i>

ci-key

<i class="ci-key"></i>

ci-layers

<i class="ci-layers"></i>

ci-layout

<i class="ci-layout"></i>

ci-leafeco sustainable plant

<i class="ci-leaf"></i>

ci-life-buoysupport

<i class="ci-life-buoy"></i>

ci-link

ci-link-2

ci-list

<i class="ci-list"></i>

ci-loader

<i class="ci-loader"></i>

ci-lock

<i class="ci-lock"></i>

ci-log-inlogin signin

<i class="ci-log-in"></i>

ci-log-outlogout signout

<i class="ci-log-out"></i>

ci-mailenvelope email

<i class="ci-mail"></i>

ci-map

<i class="ci-map"></i>

ci-map-pinlocation

<i class="ci-map-pin"></i>

ci-maximizeexpand fullscreen

<i class="ci-maximize"></i>

ci-maximize-2expand

<i class="ci-maximize-2"></i>

ci-mehemoji

<i class="ci-meh"></i>

ci-menu

<i class="ci-menu"></i>

ci-message-circle

<i class="ci-message-circle"></i>

ci-message-square

<i class="ci-message-square"></i>

ci-mic

<i class="ci-mic"></i>

ci-mic-off

<i class="ci-mic-off"></i>

ci-minimizecollapse

<i class="ci-minimize"></i>

ci-minimize-2collapse

<i class="ci-minimize-2"></i>

ci-minus

<i class="ci-minus"></i>

ci-minus-circle

<i class="ci-minus-circle"></i>

ci-minus-square

<i class="ci-minus-square"></i>

ci-monitor

<i class="ci-monitor"></i>

ci-monitor-2

<i class="ci-monitor-2"></i>

ci-moon

<i class="ci-moon"></i>

ci-more-horizontal

<i class="ci-more-horizontal"></i>

ci-more-vertical

<i class="ci-more-vertical"></i>

ci-mouse-pointer

<i class="ci-mouse-pointer"></i>

ci-move

<i class="ci-move"></i>

ci-music

<i class="ci-music"></i>

ci-navigation

<i class="ci-navigation"></i>

ci-navigation-2

<i class="ci-navigation-2"></i>

ci-package

<i class="ci-package"></i>

ci-paintcolor fill bucket

<i class="ci-paint"></i>

ci-paperclip

<i class="ci-paperclip"></i>

ci-pause

<i class="ci-pause"></i>

ci-pause-circle

<i class="ci-pause-circle"></i>

ci-pen-tool

<i class="ci-pen-tool"></i>

ci-percent

<i class="ci-percent"></i>

ci-phone

<i class="ci-phone"></i>

ci-phone-call

<i class="ci-phone-call"></i>

ci-phone-forwarded

<i class="ci-phone-forwarded"></i>

ci-phone-incoming

<i class="ci-phone-incoming"></i>

ci-phone-missed

<i class="ci-phone-missed"></i>

ci-phone-off

<i class="ci-phone-off"></i>

ci-phone-outgoing

<i class="ci-phone-outgoing"></i>

ci-pie-chart

<i class="ci-pie-chart"></i>

ci-play

<i class="ci-play"></i>

ci-play-circle

<i class="ci-play-circle"></i>

ci-play-filled

<i class="ci-play-filled"></i>

ci-plus

<i class="ci-plus"></i>

ci-plus-circle

<i class="ci-plus-circle"></i>

ci-plus-square

<i class="ci-plus-square"></i>

ci-power

<i class="ci-power"></i>

ci-powerbank

<i class="ci-powerbank"></i>

ci-printer

<i class="ci-printer"></i>

ci-printer-2

<i class="ci-printer-2"></i>

ci-radiosignal

<i class="ci-radio"></i>

ci-refresh-ccw

<i class="ci-refresh-ccw"></i>

ci-refresh-cw

<i class="ci-refresh-cw"></i>

ci-rewind

<i class="ci-rewind"></i>

ci-rocket

<i class="ci-rocket"></i>

ci-rotate-ccw

<i class="ci-rotate-ccw"></i>

ci-rotate-cw

<i class="ci-rotate-cw"></i>

ci-rss

<i class="ci-rss"></i>

ci-rulersize

<i class="ci-ruler"></i>

ci-save

<i class="ci-save"></i>

ci-scan

<i class="ci-scan"></i>

ci-schedulecalendar time date

<i class="ci-schedule"></i>

ci-scissors

<i class="ci-scissors"></i>

ci-search

ci-send

<i class="ci-send"></i>

ci-server

<i class="ci-server"></i>

ci-settingscog

<i class="ci-settings"></i>

ci-share

<i class="ci-share"></i>

ci-share-2

<i class="ci-share-2"></i>

ci-shield

<i class="ci-shield"></i>

ci-shield-off

<i class="ci-shield-off"></i>

ci-shopping-bag

<i class="ci-shopping-bag"></i>

ci-shopping-cart

<i class="ci-shopping-cart"></i>

ci-shuffle

<i class="ci-shuffle"></i>

ci-sidebar

<i class="ci-sidebar"></i>

ci-skip-back

<i class="ci-skip-back"></i>

ci-skip-forward

<i class="ci-skip-forward"></i>

ci-sliderssettings

<i class="ci-sliders"></i>

ci-smartphone

<i class="ci-smartphone"></i>

ci-smartphone-2

<i class="ci-smartphone-2"></i>

ci-smileemoji happy

<i class="ci-smile"></i>

ci-sort

<i class="ci-sort"></i>

ci-speaker

<i class="ci-speaker"></i>

ci-speaker-2

<i class="ci-speaker-2"></i>

ci-star

<i class="ci-star"></i>

ci-star-half

<i class="ci-star-half"></i>

ci-star-filled

<i class="ci-star-filled"></i>

ci-stop-circle

<i class="ci-stop-circle"></i>

ci-sun

<i class="ci-sun"></i>

ci-sunrise

<i class="ci-sunrise"></i>

ci-sunset

<i class="ci-sunset"></i>

ci-table

<i class="ci-table"></i>

ci-tablet

<i class="ci-tablet"></i>

ci-tag

<i class="ci-tag"></i>

ci-target

<i class="ci-target"></i>

ci-terminal

<i class="ci-terminal"></i>

ci-thermometer

<i class="ci-thermometer"></i>

ci-thumbs-downdislike

<i class="ci-thumbs-down"></i>

ci-thumbs-updislike

<i class="ci-thumbs-up"></i>

ci-ticketcoupon voucher

<i class="ci-ticket"></i>

ci-toolwrench

<i class="ci-tool"></i>

ci-trash

<i class="ci-trash"></i>

ci-trash-empty

<i class="ci-trash-empty"></i>

ci-trending-down

ci-trending-up

ci-triangle

<i class="ci-triangle"></i>

ci-truckdelivery

<i class="ci-truck"></i>

ci-tv

<i class="ci-tv"></i>

ci-type

<i class="ci-type"></i>

ci-umbrella

<i class="ci-umbrella"></i>

ci-unlock

<i class="ci-unlock"></i>

ci-upload

<i class="ci-upload"></i>

ci-upload-cloud

<i class="ci-upload-cloud"></i>

ci-user

<i class="ci-user"></i>

ci-user-check

<i class="ci-user-check"></i>

ci-user-plus

<i class="ci-user-plus"></i>

ci-user-x

<i class="ci-user-x"></i>

ci-video

<i class="ci-video"></i>

ci-video-off

<i class="ci-video-off"></i>

ci-voicemail

<i class="ci-voicemail"></i>

ci-volume

<i class="ci-volume"></i>

ci-volume-1

<i class="ci-volume-1"></i>

ci-volume-2

<i class="ci-volume-2"></i>

ci-volume-x

<i class="ci-volume-x"></i>

ci-watchtime

<i class="ci-watch"></i>

ci-watch-2time

<i class="ci-watch-2"></i>

ci-wifi

<i class="ci-wifi"></i>

ci-wifi-off

<i class="ci-wifi-off"></i>

ci-wind

<i class="ci-wind"></i>

ci-closex

<i class="ci-close"></i>

ci-close-circlex

<i class="ci-close-circle"></i>

ci-close-octagonx

<i class="ci-close-octagon"></i>

ci-close-squarex

<i class="ci-close-square"></i>

ci-zaplightning

<i class="ci-zap"></i>

ci-zap-offlightning

<i class="ci-zap-off"></i>

ci-zoom-in

<i class="ci-zoom-in"></i>

ci-zoom-out

<i class="ci-zoom-out"></i>

Brand icons

ci-airbnb

<i class="ci-airbnb"></i>

ci-apple

<i class="ci-apple"></i>

ci-behance

<i class="ci-behance"></i>

ci-blogger

<i class="ci-blogger"></i>

ci-codepen

<i class="ci-codepen"></i>

ci-discord

<i class="ci-discord"></i>

ci-disqus

<i class="ci-disqus"></i>

ci-dribbble

<i class="ci-dribbble"></i>

ci-dropbox

<i class="ci-dropbox"></i>

ci-envato

<i class="ci-envato"></i>

ci-evernote

<i class="ci-evernote"></i>

ci-facebook

<i class="ci-facebook"></i>

ci-flickr

<i class="ci-flickr"></i>

ci-foursquare

<i class="ci-foursquare"></i>

ci-github

<i class="ci-github"></i>

ci-google

<i class="ci-google"></i>

ci-google-drive

<i class="ci-google-drive"></i>

ci-google-play

<i class="ci-google-play"></i>

ci-hangouts

<i class="ci-hangouts"></i>

ci-instagram

<i class="ci-instagram"></i>

ci-kickstarter

<i class="ci-kickstarter"></i>

ci-linkedin

<i class="ci-linkedin"></i>

ci-medium

<i class="ci-medium"></i>

ci-messenger

<i class="ci-messenger"></i>

ci-myspace

<i class="ci-myspace"></i>

ci-odnoklassniki

<i class="ci-odnoklassniki"></i>

ci-open-source

<i class="ci-open-source"></i>

ci-patreon

<i class="ci-patreon"></i>

ci-pinterest

<i class="ci-pinterest"></i>

ci-product-hunt

<i class="ci-product-hunt"></i>

ci-quora

<i class="ci-quora"></i>

ci-reddit

<i class="ci-reddit"></i>

ci-rss-2

<i class="ci-rss-2"></i>

ci-skype

<i class="ci-skype"></i>

ci-slack

<i class="ci-slack"></i>

ci-snapchat

<i class="ci-snapchat"></i>

ci-soundcloud

<i class="ci-soundcloud"></i>

ci-spotify

<i class="ci-spotify"></i>

ci-stack-overflow

<i class="ci-stack-overflow"></i>

ci-steam

<i class="ci-steam"></i>

ci-stumbleupon

<i class="ci-stumbleupon"></i>

ci-team-viewer

<i class="ci-team-viewer"></i>

ci-telegram

<i class="ci-telegram"></i>

ci-tinder

<i class="ci-tinder"></i>

ci-trello

<i class="ci-trello"></i>

ci-tumblr

<i class="ci-tumblr"></i>

ci-twitch

<i class="ci-twitch"></i>

ci-xtwitter

<i class="ci-x"></i>

ci-viber

<i class="ci-viber"></i>

ci-vimeo

<i class="ci-vimeo"></i>

ci-vk

<i class="ci-vk"></i>

ci-wechat

<i class="ci-wechat"></i>

ci-whatsapp

<i class="ci-whatsapp"></i>

ci-xing

<i class="ci-xing"></i>

ci-yelp

<i class="ci-yelp"></i>

ci-youtube

<i class="ci-youtube"></i>

Animate on hover

Shake
Pulse
Rotate
Scale
Slide up
Slide end
Slide down
Slide start
<!-- Icon animations on hover -->

<!-- Shake -->
<button type="button" class="btn btn-icon btn-lg btn-outline-secondary animate-shake fs-xl" aria-label="Shake icon">
  <i class="ci-bell animate-target"></i>
</button>

<!-- Pulse -->
<button type="button" class="btn btn-icon btn-lg btn-outline-secondary animate-pulse fs-xl" aria-label="Pulse icon">
  <i class="ci-heart animate-target"></i>
</button>

<!-- Rotate -->
<button type="button" class="btn btn-icon btn-lg btn-outline-secondary animate-rotate fs-xl" aria-label="Rotate icon">
  <i class="ci-refresh-cw animate-target"></i>
</button>

<!-- Scale -->
<button type="button" class="btn btn-icon btn-lg btn-outline-secondary animate-scale fs-xl" aria-label="Scale icon">
  <i class="ci-search animate-target"></i>
</button>

<!-- Slide up -->
<button type="button" class="btn btn-icon btn-lg btn-outline-secondary animate-slide-up fs-xl" aria-label="Slide up icon">
  <i class="ci-arrow-up animate-target"></i>
</button>

<!-- Slide end -->
<button type="button" class="btn btn-icon btn-lg btn-outline-secondary animate-slide-end fs-xl" aria-label="Slide end icon">
  <i class="ci-arrow-right animate-target"></i>
</button>

<!-- Slide down -->
<button type="button" class="btn btn-icon btn-lg btn-outline-secondary animate-slide-down fs-xl" aria-label="Slide down icon">
  <i class="ci-arrow-down animate-target"></i>
</button>

<!-- Slide start -->
<button type="button" class="btn btn-icon btn-lg btn-outline-secondary animate-slide-start fs-xl" aria-label="Slide start icon">
  <i class="ci-arrow-left animate-target"></i>
</button>

Icon with text

24/7 Customer Support

Friendly customer support

Eco-friendly

Decorate your space with eco-friendly furniture with low VOCs, environmentally friendly materials and safe coatings.

Gluten-Free

Foods that don't contain gluten

<!-- Icon with text examples -->

<!-- Horizontal: font icon -->
<div class="d-flex align-items-center">
  <div class="d-flex bg-body-tertiary text-dark-emphasis rounded-circle p-4">
    <i class="ci-chat fs-2 m-1"></i>
  </div>
  <div class="ps-3">
    <h3 class="h6 mb-1">24/7 Customer Support</h3>
    <p class="fs-sm mb-0">Friendly customer support</p>
  </div>
</div>

<!-- Vertical: svg icon -->
<div class="text-center">
  <div class="text-dark-emphasis mb-3">
    <svg xmlns="http://www.w3.org/2000/svg" width="64" height="64" fill="currentColor"><path d="M62.189 9.902c0-.604-.604-1.208-1.208-1.208h-6.158-3.14l-1.691.121-1.57.242c-2.174.483-4.226 1.087-6.159 2.174s-3.623 2.294-5.072 3.864h-.121c-3.14 3.019-5.313 7.004-6.038 11.351l-.241 1.57-.121 1.691v3.14 5.796c-.604.845-1.087 1.691-1.57 2.536.121-1.328.121-2.536.242-3.864 0-.966.121-1.811.121-2.777v-1.449l-.121-1.449c-.242-1.811-.845-3.743-1.691-5.434a20.6 20.6 0 0 0-3.26-4.71c-2.657-2.777-6.279-4.709-10.143-5.434l-1.449-.242-1.449-.121H8.574 3.019c-.604 0-1.208.604-1.208 1.208v5.555 2.777l.121 1.449.242 1.449C2.898 32 4.83 35.502 7.728 38.159c1.449 1.328 3.019 2.415 4.709 3.26s3.623 1.328 5.434 1.691l1.449.121h1.449c.966 0 1.811-.121 2.777-.121 1.57-.121 3.14-.121 4.709-.242-.362.604-.604 1.328-.966 1.932-1.449 3.381-2.294 7.004-2.294 10.506.966-3.502 2.294-6.642 3.985-9.66.966-1.811 2.174-3.623 3.381-5.313h5.676 3.14l1.691-.121 1.57-.242c2.174-.483 4.226-1.087 6.159-2.174s3.623-2.294 5.072-3.864h.121c3.14-3.019 5.313-7.004 6.038-11.351l.242-1.57.121-1.69v-3.14-6.279zM49.63 35.743c-1.69.966-3.623 1.449-5.555 1.811l-1.449.242-1.449.121h-3.019-3.864c.242-.242.483-.604.724-.845 2.174-2.657 4.589-5.192 7.004-7.728l7.366-7.728c-3.019 1.932-5.917 3.985-8.694 6.279-2.657 2.294-5.192 4.709-7.487 7.487v-2.536-3.019l.121-1.449.242-1.449c.362-1.932.845-3.864 1.811-5.555.845-1.691 2.053-3.381 3.381-4.83 1.449-1.328 3.019-2.415 4.709-3.381s3.623-1.449 5.555-1.811l1.449-.241 1.449-.121h3.019 4.951v4.951 3.019l-.121 1.57-.242 1.449c-.362 1.932-.845 3.864-1.811 5.555-.845 1.691-2.053 3.381-3.381 4.83a17.86 17.86 0 0 1-4.709 3.381zm-26.083 6.762c-.966 0-1.811-.121-2.777-.121l-1.328-.121-1.328-.242c-3.502-.724-6.641-2.536-9.057-5.072-1.208-1.328-2.174-2.657-3.019-4.226-.725-1.57-1.208-3.26-1.57-4.951l-.242-1.328-.121-1.328V22.34v-4.347h4.347 2.777 1.328l1.328.121c1.691.242 3.381.725 4.951 1.57 1.449 1.087 2.898 2.053 4.106 3.26 2.536 2.415 4.347 5.555 5.072 9.057l.241 1.328.121 1.328c.121.845.121 1.811.121 2.777.121 1.449.121 2.777.241 4.226-.241.483-.483.845-.724 1.328-1.328-.362-2.898-.362-4.468-.483zm-5.434-12.437c-1.449-.966-2.898-1.932-4.589-2.657.966 1.449 2.174 2.777 3.381 3.985 2.415 2.536 4.83 4.709 7.487 7.124 1.328 1.087 2.536 2.294 4.106 3.381-.725-1.691-1.57-3.26-2.657-4.589-2.174-2.898-4.709-5.193-7.728-7.245z"/></svg>
  </div>
  <h3 class="h5 mb-3">Eco-friendly</h3>
  <p class="fs-sm mb-0">Decorate your space with eco-friendly furniture with low VOCs, environmentally friendly materials and safe coatings.</p>
</div>

<!-- Vertical: svg icon on background -->
<div class="text-center">
  <div class="d-inline-block text-dark-emphasis bg-warning-subtle rounded-circle p-5 mb-4">
    <svg class="m-2" xmlns="http://www.w3.org/2000/svg" width="76" height="76" viewBox="0 0 76 76" fill="none"><path d="M62.631 13.369l-7.214 7.214M20.583 55.417l-7.214 7.214M38 51.037c0-11.315-13.926-11.315-13.926-11.315s0 13.926 11.315 13.926H38m0-2.611v2.611m0-2.611c0-11.315 13.926-11.315 13.926-11.315s0 13.926-11.315 13.926H38m0-14.222c0-11.315-13.926-11.315-13.926-11.315s0 13.926 11.315 13.926H38m0-2.611v2.611m0-2.611c0-11.315 13.926-11.315 13.926-11.315s0 13.926-11.315 13.926H38m0 18.585v-6.967M72.833 38c0 19.238-15.595 34.833-34.833 34.833S3.167 57.238 3.167 38 18.762 3.167 38 3.167 72.833 18.762 72.833 38zM38 15.378s9.847 9.849 1.846 17.849L38 35.074l-1.846-1.847C28.153 25.227 38 15.378 38 15.378z" stroke="currentColor" stroke-width="2.5" stroke-miterlimit="10" stroke-linecap="round" stroke-linejoin="round"/></svg>
  </div>
  <h3 class="h5 mb-2">Gluten-Free</h3>
  <p class="fs-sm mb-0">Foods that don't contain gluten</p>
</div>
Top