Stuart Weitzman® Design Tokens

version 1.0.0 | changelog

Assets

Variables

Color

Identifier Value Example
  • css --color-primary
  • scss $color-primary 
#000001
  • css --color-secondary
  • scss $color-secondary 
#fffffe
  • css --color-white
  • scss $color-white 
#ffffff
  • css --color-black
  • scss $color-black 
#000000
  • css --color-neutral-base
  • scss $color-neutral-base 
#575757
  • css --color-neutral-light
  • scss $color-neutral-light 
#f7f7f7
  • css --color-neutral-dark
  • scss $color-neutral-dark 
#2e2e2e
  • css --color-error-primary
  • scss $color-error-primary 
#dd191f
  • css --color-error-secondary
  • scss $color-error-secondary 
#ffeef0
  • css --color-inactive
  • scss $color-inactive 
#d8d8d8
  • css --color-scrim-light
  • scss $color-scrim-light 
rgba(255, 255, 255, 0.5)
  • css --color-scrim-dark
  • scss $color-scrim-dark 
rgba(0, 0, 0, 0.8)
  • css --color-standout-primary
  • scss $color-standout-primary 
#001489
  • css --color-standout-secondary
  • scss $color-standout-secondary 
#edf4ff
  • css --color-success-primary
  • scss $color-success-primary 
#22863a
  • css --color-success-secondary
  • scss $color-success-secondary 
#f0fff4
  • css --color-cool-grey
  • scss $color-cool-grey 
#f5f7f8

Font Family

Identifier Value Example
  • css --font-system
  • scss $font-system 
-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji'
Aa
  • css --font-primary-normal
  • scss $font-primary-normal 
FuturaBT-Book, Helvetica, Arial, sans-serif
Aa
  • css --font-primary-medium
  • scss $font-primary-medium 
FuturaBT-Medium, Helvetica, Arial, sans-serif
Aa
  • css --font-primary-bold
  • scss $font-primary-bold 
FuturaBT-Bold, Helvetica, Arial, sans-serif
Aa
  • css --font-secondary-normal
  • scss $font-secondary-normal 
HeldaneText-Regular, serif
Aa

Font Size

Identifier Value Example
  • css --text-9
  • scss $text-9 
0.5625rem /*9px*/
Aa
  • css --text-10
  • scss $text-10 
0.625rem /*10px*/
Aa
  • css --text-12
  • scss $text-12 
0.75rem /*12px*/
Aa
  • css --text-14
  • scss $text-14 
0.875rem /*14px*/
Aa
  • css --text-16
  • scss $text-16 
1rem /*16px*/
Aa
  • css --text-20
  • scss $text-20 
1.25rem /*20px*/
Aa
  • css --text-24
  • scss $text-24 
1.5rem /*24px*/
Aa
  • css --text-28
  • scss $text-28 
1.75rem /*28px*/
Aa
  • css --text-32
  • scss $text-32 
2rem /*32px*/
Aa
  • css --text-40
  • scss $text-40 
2.5rem /*40px*/
Aa
  • css --text-48
  • scss $text-48 
3rem /*48px*/
Aa

Letter Spacing

Identifier Value Example
  • css --letter-spacing-xs
  • scss $letter-spacing-xs 
0.0125rem /*0.2px*/

Tapestry is a global house of brands.
  • css --letter-spacing-s
  • scss $letter-spacing-s 
0.025rem /*0.4px*/

Tapestry is a global house of brands.
  • css --letter-spacing-m
  • scss $letter-spacing-m 
0.05rem /*0.8px*/

Tapestry is a global house of brands.
  • css --letter-spacing-l
  • scss $letter-spacing-l 
0.0625rem /*1px*/

Tapestry is a global house of brands.
  • css --letter-spacing-xl
  • scss $letter-spacing-xl 
0.078125rem /*1.25px*/

Tapestry is a global house of brands.
  • css --letter-spacing-2xl
  • scss $letter-spacing-2xl 
0.109375rem /*1.75px*/

Tapestry is a global house of brands.

Line Height

Identifier Value Example
  • css --line-height-xs
  • scss $line-height-xs 
1.15

Tapestry is a global house of brands powered by optimism, innovation, and inclusivity. We believe true luxury is a freedom of expression that ignites confidence and authenticity. At Tapestry, anyone from anywhere can have the best idea, and with hard work and dedication, anything is possible.

  • css --line-height-s
  • scss $line-height-s 
1.2

Tapestry is a global house of brands powered by optimism, innovation, and inclusivity. We believe true luxury is a freedom of expression that ignites confidence and authenticity. At Tapestry, anyone from anywhere can have the best idea, and with hard work and dedication, anything is possible.

  • css --line-height-m
  • scss $line-height-m 
1.25

Tapestry is a global house of brands powered by optimism, innovation, and inclusivity. We believe true luxury is a freedom of expression that ignites confidence and authenticity. At Tapestry, anyone from anywhere can have the best idea, and with hard work and dedication, anything is possible.

  • css --line-height-l
  • scss $line-height-l 
1.35

Tapestry is a global house of brands powered by optimism, innovation, and inclusivity. We believe true luxury is a freedom of expression that ignites confidence and authenticity. At Tapestry, anyone from anywhere can have the best idea, and with hard work and dedication, anything is possible.

  • css --line-height-xl
  • scss $line-height-xl 
1.4

Tapestry is a global house of brands powered by optimism, innovation, and inclusivity. We believe true luxury is a freedom of expression that ignites confidence and authenticity. At Tapestry, anyone from anywhere can have the best idea, and with hard work and dedication, anything is possible.

  • css --line-height-2xl
  • scss $line-height-2xl 
1.5

Tapestry is a global house of brands powered by optimism, innovation, and inclusivity. We believe true luxury is a freedom of expression that ignites confidence and authenticity. At Tapestry, anyone from anywhere can have the best idea, and with hard work and dedication, anything is possible.

Box Shadow

Identifier Value Example
  • css --shadow-l
  • scss $shadow-l 
-6px 0px 10px -3px rgba(0, 0, 0, 0.1)
  • css --shadow-t
  • scss $shadow-t 
0px -6px 10px -3px rgba(0, 0, 0, 0.1)
  • css --shadow-r
  • scss $shadow-r 
6px 0px 10px -3px rgba(0, 0, 0, 0.1)
  • css --shadow-b
  • scss $shadow-b 
0px 6px 10px -3px rgba(0, 0, 0, 0.1)
  • css --shadow-ltr
  • scss $shadow-ltr 
0px -5px 10px -1px rgba(0, 0, 0, 0.1),
-6px 0px 10px -5px rgba(0, 0, 0, 0.1),
6px 0px 10px -5px rgba(0, 0, 0, 0.1)
  • css --shadow-ltrb
  • scss $shadow-ltrb 
0px 0px 20px 3px rgba(0, 0, 0, 0.35)

Viewport

Identifier Value Example
  • css --viewport-xs
  • scss $viewport-xs 
screen and (min-width: 0)
Matches Does not Match
  • css --viewport-s
  • scss $viewport-s 
screen and (min-width: 34em)
Matches Does not Match
  • css --viewport-m
  • scss $viewport-m 
screen and (min-width: 48.0625em)
Matches Does not Match
  • css --viewport-l
  • scss $viewport-l 
screen and (min-width: 62em)
Matches Does not Match
  • css --viewport-xl
  • scss $viewport-xl 
screen and (min-width: 75em)
Matches Does not Match

Spacing

Identifier Value Example
  • css --spacing-1
  • scss $spacing-1 
0.25rem /*4px*/
  • css --spacing-2
  • scss $spacing-2 
0.5rem /*8px*/
  • css --spacing-3
  • scss $spacing-3 
0.75rem /*12px*/
  • css --spacing-4
  • scss $spacing-4 
1rem /*16px*/
  • css --spacing-6
  • scss $spacing-6 
1.5rem /*24px*/
  • css --spacing-8
  • scss $spacing-8 
2rem /*32px*/
  • css --spacing-12
  • scss $spacing-12 
3rem /*48px*/
  • css --spacing-24
  • scss $spacing-24 
6rem /*96px*/

Classes

Background Color

Identifier Value Example
  • class bg-primary 
background-color: #000001
  • class bg-secondary 
background-color: #fffffe
  • class bg-white 
background-color: #ffffff
  • class bg-black 
background-color: #000000
  • class bg-neutral-base 
background-color: #575757
  • class bg-neutral-light 
background-color: #f7f7f7
  • class bg-neutral-dark 
background-color: #2e2e2e
  • class bg-error-primary 
background-color: #dd191f
  • class bg-error-secondary 
background-color: #ffeef0
  • class bg-inactive 
background-color: #d8d8d8
  • class bg-scrim-light 
background-color: rgba(255, 255, 255, 0.5)
  • class bg-scrim-dark 
background-color: rgba(0, 0, 0, 0.8)
  • class bg-standout-primary 
background-color: #001489
  • class bg-standout-secondary 
background-color: #edf4ff
  • class bg-success-primary 
background-color: #22863a
  • class bg-success-secondary 
background-color: #f0fff4
  • class bg-cool-grey 
background-color: #f5f7f8

Border Color

Identifier Value Example
  • class border-primary 
border-color: #000001
  • class border-secondary 
border-color: #fffffe
  • class border-white 
border-color: #ffffff
  • class border-black 
border-color: #000000
  • class border-neutral-base 
border-color: #575757
  • class border-neutral-light 
border-color: #f7f7f7
  • class border-neutral-dark 
border-color: #2e2e2e
  • class border-error-primary 
border-color: #dd191f
  • class border-error-secondary 
border-color: #ffeef0
  • class border-inactive 
border-color: #d8d8d8
  • class border-scrim-light 
border-color: rgba(255, 255, 255, 0.5)
  • class border-scrim-dark 
border-color: rgba(0, 0, 0, 0.8)
  • class border-standout-primary 
border-color: #001489
  • class border-standout-secondary 
border-color: #edf4ff
  • class border-success-primary 
border-color: #22863a
  • class border-success-secondary 
border-color: #f0fff4
  • class border-cool-grey 
border-color: #f5f7f8

Font Family

Identifier Value Example
  • class font-system 
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji'
Aa
  • class font-primary-normal 
font-family: FuturaBT-Book, Helvetica, Arial, sans-serif
Aa
  • class font-primary-medium 
font-family: FuturaBT-Medium, Helvetica, Arial, sans-serif
Aa
  • class font-primary-bold 
font-family: FuturaBT-Bold, Helvetica, Arial, sans-serif
Aa
  • class font-secondary-normal 
font-family: HeldaneText-Regular, serif
Aa

Font Size

Identifier Value Example
  • class text-9 
font-size: 0.5625rem
Aa
  • class text-10 
font-size: 0.625rem
Aa
  • class text-12 
font-size: 0.75rem
Aa
  • class text-14 
font-size: 0.875rem
Aa
  • class text-16 
font-size: 1rem
Aa
  • class text-20 
font-size: 1.25rem
Aa
  • class text-24 
font-size: 1.5rem
Aa
  • class text-28 
font-size: 1.75rem
Aa
  • class text-32 
font-size: 2rem
Aa
  • class text-40 
font-size: 2.5rem
Aa
  • class text-48 
font-size: 3rem
Aa

Letter Spacing

Identifier Value Example
  • class letter-spacing-xs 
letter-spacing: 0.0125rem

Tapestry is a global house of brands.
  • class letter-spacing-s 
letter-spacing: 0.025rem

Tapestry is a global house of brands.
  • class letter-spacing-m 
letter-spacing: 0.05rem

Tapestry is a global house of brands.
  • class letter-spacing-l 
letter-spacing: 0.0625rem

Tapestry is a global house of brands.
  • class letter-spacing-xl 
letter-spacing: 0.078125rem

Tapestry is a global house of brands.
  • class letter-spacing-2xl 
letter-spacing: 0.109375rem

Tapestry is a global house of brands.

Line Height

Identifier Value Example
  • class line-height-xs 
line-height: 1.15

Tapestry is a global house of brands powered by optimism, innovation, and inclusivity. We believe true luxury is a freedom of expression that ignites confidence and authenticity. At Tapestry, anyone from anywhere can have the best idea, and with hard work and dedication, anything is possible.

  • class line-height-s 
line-height: 1.2

Tapestry is a global house of brands powered by optimism, innovation, and inclusivity. We believe true luxury is a freedom of expression that ignites confidence and authenticity. At Tapestry, anyone from anywhere can have the best idea, and with hard work and dedication, anything is possible.

  • class line-height-m 
line-height: 1.25

Tapestry is a global house of brands powered by optimism, innovation, and inclusivity. We believe true luxury is a freedom of expression that ignites confidence and authenticity. At Tapestry, anyone from anywhere can have the best idea, and with hard work and dedication, anything is possible.

  • class line-height-l 
line-height: 1.35

Tapestry is a global house of brands powered by optimism, innovation, and inclusivity. We believe true luxury is a freedom of expression that ignites confidence and authenticity. At Tapestry, anyone from anywhere can have the best idea, and with hard work and dedication, anything is possible.

  • class line-height-xl 
line-height: 1.4

Tapestry is a global house of brands powered by optimism, innovation, and inclusivity. We believe true luxury is a freedom of expression that ignites confidence and authenticity. At Tapestry, anyone from anywhere can have the best idea, and with hard work and dedication, anything is possible.

  • class line-height-2xl 
line-height: 1.5

Tapestry is a global house of brands powered by optimism, innovation, and inclusivity. We believe true luxury is a freedom of expression that ignites confidence and authenticity. At Tapestry, anyone from anywhere can have the best idea, and with hard work and dedication, anything is possible.

Text Color

Identifier Value Example
  • class text-primary 
color: #000001
Aa
  • class text-secondary 
color: #fffffe
Aa
  • class text-white 
color: #ffffff
Aa
  • class text-black 
color: #000000
Aa
  • class text-neutral-base 
color: #575757
Aa
  • class text-neutral-light 
color: #f7f7f7
Aa
  • class text-neutral-dark 
color: #2e2e2e
Aa
  • class text-error-primary 
color: #dd191f
Aa
  • class text-error-secondary 
color: #ffeef0
Aa
  • class text-inactive 
color: #d8d8d8
Aa
  • class text-scrim-light 
color: rgba(255, 255, 255, 0.5)
Aa
  • class text-scrim-dark 
color: rgba(0, 0, 0, 0.8)
Aa
  • class text-standout-primary 
color: #001489
Aa
  • class text-standout-secondary 
color: #edf4ff
Aa
  • class text-success-primary 
color: #22863a
Aa
  • class text-success-secondary 
color: #f0fff4
Aa
  • class text-cool-grey 
color: #f5f7f8
Aa

Box Shadow

Identifier Value Example
  • class shadow-l 
--tw-shadow: -6px 0px 10px -3px rgba(0, 0, 0, 0.1);
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
  • class shadow-t 
--tw-shadow: 0px -6px 10px -3px rgba(0, 0, 0, 0.1);
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
  • class shadow-r 
--tw-shadow: 6px 0px 10px -3px rgba(0, 0, 0, 0.1);
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
  • class shadow-b 
--tw-shadow: 0px 6px 10px -3px rgba(0, 0, 0, 0.1);
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
  • class shadow-ltr 
--tw-shadow: 0px -5px 10px -1px rgba(0, 0, 0, 0.1),
-6px 0px 10px -5px rgba(0, 0, 0, 0.1),
6px 0px 10px -5px rgba(0, 0, 0, 0.1);
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)
  • class shadow-ltrb 
--tw-shadow: 0px 0px 20px 3px rgba(0, 0, 0, 0.35);
box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)

Typography

Identifier Value Example
  • class text-primary-display-xs 
font-family: FuturaBT-Book, Helvetica, Arial, sans-serif;
font-size: 1.25rem;
letter-spacing: 0.0625rem;
line-height: 1.5
This is a Headline
  • class text-primary-display-s 
font-family: FuturaBT-Book, Helvetica, Arial, sans-serif;
font-size: 1.5rem;
letter-spacing: 0.078125rem;
line-height: 1.25
This is a Headline
  • class text-primary-display-m 
font-family: FuturaBT-Book, Helvetica, Arial, sans-serif;
font-size: 1.75rem;
letter-spacing: 0.078125rem;
line-height: 1.25
This is a Headline
  • class text-primary-display-l 
font-family: FuturaBT-Book, Helvetica, Arial, sans-serif;
font-size: 2rem;
letter-spacing: 0.078125rem;
line-height: 1.25
This is a Headline
  • class text-primary-display-xl 
font-family: FuturaBT-Book, Helvetica, Arial, sans-serif;
font-size: 2.5rem;
letter-spacing: 0.078125rem;
line-height: 1.2
This is a Headline
  • class text-primary-display-2xl 
font-family: FuturaBT-Book, Helvetica, Arial, sans-serif;
font-size: 3rem;
letter-spacing: 0.109375rem;
line-height: 1.25
This is a Headline
  • class text-primary-body-s 
font-family: FuturaBT-Book, Helvetica, Arial, sans-serif;
font-size: 0.75rem;
letter-spacing: 0.0125rem;
line-height: 1.35
Tapestry is a global house of brands powered by optimism, innovation, and inclusivity. We believe true luxury is a freedom of expression that ignites confidence and authenticity. At Tapestry, anyone from anywhere can have the best idea, and with hard work and dedication, anything is possible.
  • class text-primary-body-m 
font-family: FuturaBT-Book, Helvetica, Arial, sans-serif;
font-size: 0.875rem;
letter-spacing: 0.0125rem;
line-height: 1.25
Tapestry is a global house of brands powered by optimism, innovation, and inclusivity. We believe true luxury is a freedom of expression that ignites confidence and authenticity. At Tapestry, anyone from anywhere can have the best idea, and with hard work and dedication, anything is possible.
  • class text-primary-body-l 
font-family: FuturaBT-Book, Helvetica, Arial, sans-serif;
font-size: 1rem;
letter-spacing: 0.0125rem;
line-height: 1.5
Tapestry is a global house of brands powered by optimism, innovation, and inclusivity. We believe true luxury is a freedom of expression that ignites confidence and authenticity. At Tapestry, anyone from anywhere can have the best idea, and with hard work and dedication, anything is possible.
  • class text-primary-eyebrow-s 
font-family: FuturaBT-Medium, Helvetica, Arial, sans-serif;
font-size: 0.625rem;
letter-spacing: 0.05rem;
line-height: 1.5;
text-transform: uppercase
Eyebrow Text
  • class text-primary-eyebrow-m 
font-family: FuturaBT-Medium, Helvetica, Arial, sans-serif;
font-size: 0.75rem;
letter-spacing: 0.0625rem;
line-height: 1.35;
text-transform: uppercase
Eyebrow Text
  • class text-primary-cta-s 
font-family: FuturaBT-Book, Helvetica, Arial, sans-serif;
font-size: 0.75rem;
letter-spacing: 0.078125rem;
line-height: 1.2;
text-transform: uppercase
CTA Text
  • class text-primary-cta-m 
font-family: FuturaBT-Book, Helvetica, Arial, sans-serif;
font-size: 0.875rem;
letter-spacing: 0.0625rem;
line-height: 1.15;
text-transform: uppercase
CTA Text
  • class text-primary-badge-xs 
font-family: FuturaBT-Bold, Helvetica, Arial, sans-serif;
font-size: 0.625rem;
letter-spacing: 0.05rem;
line-height: 1.15;
text-transform: uppercase
Badge Text
  • class text-secondary-display-xs 
font-family: HeldaneText-Regular, serif;
font-size: 1.25rem;
letter-spacing: 0.0625rem;
line-height: 1.35
This is a Headline
  • class text-secondary-display-s 
font-family: HeldaneText-Regular, serif;
font-size: 1.5rem;
letter-spacing: 0.078125rem;
line-height: 1.35
This is a Headline
  • class text-secondary-display-m 
font-family: HeldaneText-Regular, serif;
font-size: 1.75rem;
letter-spacing: 0.025rem;
line-height: 1.25
This is a Headline
  • class text-secondary-display-l 
font-family: HeldaneText-Regular, serif;
font-size: 2rem;
letter-spacing: 0.05rem;
line-height: 1.25
This is a Headline
  • class text-secondary-display-xl 
font-family: HeldaneText-Regular, serif;
font-size: 2.5rem;
letter-spacing: 0.05rem;
line-height: 1.25
This is a Headline
  • class text-secondary-display-2xl 
font-family: HeldaneText-Regular, serif;
font-size: 3rem;
letter-spacing: 0.025rem;
line-height: 1.25
This is a Headline
  • class text-secondary-body-s 
font-family: HeldaneText-Regular, serif;
font-size: 0.75rem;
letter-spacing: 0.0125rem;
line-height: 1.5
Tapestry is a global house of brands powered by optimism, innovation, and inclusivity. We believe true luxury is a freedom of expression that ignites confidence and authenticity. At Tapestry, anyone from anywhere can have the best idea, and with hard work and dedication, anything is possible.
  • class text-secondary-body-m 
font-family: HeldaneText-Regular, serif;
font-size: 0.875rem;
letter-spacing: 0.05rem;
line-height: 1.4
Tapestry is a global house of brands powered by optimism, innovation, and inclusivity. We believe true luxury is a freedom of expression that ignites confidence and authenticity. At Tapestry, anyone from anywhere can have the best idea, and with hard work and dedication, anything is possible.
  • class text-secondary-body-l 
font-family: HeldaneText-Regular, serif;
font-size: 1rem;
letter-spacing: 0.0625rem;
line-height: 1.4
Tapestry is a global house of brands powered by optimism, innovation, and inclusivity. We believe true luxury is a freedom of expression that ignites confidence and authenticity. At Tapestry, anyone from anywhere can have the best idea, and with hard work and dedication, anything is possible.
  • class text-secondary-body-xl 
font-family: HeldaneText-Regular, serif;
font-size: 1.25rem;
letter-spacing: 0.0625rem;
line-height: 1.35
Tapestry is a global house of brands powered by optimism, innovation, and inclusivity. We believe true luxury is a freedom of expression that ignites confidence and authenticity. At Tapestry, anyone from anywhere can have the best idea, and with hard work and dedication, anything is possible.
  • class text-secondary-body-2xl 
font-family: HeldaneText-Regular, serif;
font-size: 1.5rem;
letter-spacing: 0.078125rem;
line-height: 1.35
Tapestry is a global house of brands powered by optimism, innovation, and inclusivity. We believe true luxury is a freedom of expression that ignites confidence and authenticity. At Tapestry, anyone from anywhere can have the best idea, and with hard work and dedication, anything is possible.

Icons

Video

Path: icon/video/*

  • volume.svg

  • play.svg

  • play-cta.svg

  • pause.svg

  • option.svg

  • mute.svg

  • fullscreen.svg

Utility

Path: icon/utility/*

  • close.svg

  • chevron-up.svg

  • chevron-right.svg

  • chevron-left.svg

  • chevron-down.svg

  • caret-up.svg

  • caret-right.svg

  • caret-left.svg

  • caret-down.svg

Social

Path: icon/social/*

  • youtube.svg

  • weibo.svg

  • wechat.svg

  • twitter.svg

  • tiktok.svg

  • snapchat.svg

  • pinterest.svg

  • mail.svg

  • instagram.svg

  • facebook.svg

Review

Path: icon/review/*

  • thumb-up.svg

  • thumb-down.svg

  • star.svg

  • star-75.svg

  • star-50.svg

  • star-25.svg

Object

Path: icon/object/*

  • store.svg

  • phone.svg

  • package.svg

  • email.svg

  • credit-card.svg

  • call.svg

  • calendar.svg

  • shipping.svg

  • gift.svg

Navigation

Path: icon/navigation/*

  • search.svg

  • location.svg

  • hamburger.svg

  • favorite.svg

  • favorite-fill.svg

  • edit.svg

  • bag.svg

  • bag-3digit.svg

  • account.svg

Form

Path: icon/form/*

  • success.svg

  • info.svg

  • error.svg

Flag

Path: icon/flag/*

  • usa.svg

  • canada.svg

Compare

Path: icon/compare/*

  • selected.svg

  • inactive.svg

  • default.svg