$inter-font-display: swap !default; $inter-font-path: 'Inter (web)' !default; $inter-font-path-suffix: '?v=3.19' !default; @mixin weight-100-normal { @font-face { font-family: 'Inter'; font-style: normal; font-weight: 100; font-display: $inter-font-display; src: url("#{$inter-font-path}/Inter-Thin.woff2#{$inter-font-path-suffix}") format("woff2"), url("#{$inter-font-path}/Inter-Thin.woff#{$inter-font-path-suffix}") format("woff"); } } @mixin weight-100-italic { @font-face { font-family: 'Inter'; font-style: italic; font-weight: 100; font-display: $inter-font-display; src: url("#{$inter-font-path}/Inter-ThinItalic.woff2#{$inter-font-path-suffix}") format("woff2"), url("#{$inter-font-path}/Inter-ThinItalic.woff#{$inter-font-path-suffix}") format("woff"); } } @mixin weight-100 { @include weight-100-normal; @include weight-100-italic; } @mixin weight-200-normal { @font-face { font-family: 'Inter'; font-style: normal; font-weight: 200; font-display: $inter-font-display; src: url("#{$inter-font-path}/Inter-ExtraLight.woff2#{$inter-font-path-suffix}") format("woff2"), url("#{$inter-font-path}/Inter-ExtraLight.woff#{$inter-font-path-suffix}") format("woff"); } } @mixin weight-200-italic { @font-face { font-family: 'Inter'; font-style: italic; font-weight: 200; font-display: $inter-font-display; src: url("#{$inter-font-path}/Inter-ExtraLightItalic.woff2#{$inter-font-path-suffix}") format("woff2"), url("#{$inter-font-path}/Inter-ExtraLightItalic.woff#{$inter-font-path-suffix}") format("woff"); } } @mixin weight-200 { @include weight-200-normal; @include weight-200-italic; } @mixin weight-300-normal { @font-face { font-family: 'Inter'; font-style: normal; font-weight: 300; font-display: $inter-font-display; src: url("#{$inter-font-path}/Inter-Light.woff2#{$inter-font-path-suffix}") format("woff2"), url("#{$inter-font-path}/Inter-Light.woff#{$inter-font-path-suffix}") format("woff"); } } @mixin weight-300-italic { @font-face { font-family: 'Inter'; font-style: italic; font-weight: 300; font-display: $inter-font-display; src: url("#{$inter-font-path}/Inter-LightItalic.woff2#{$inter-font-path-suffix}") format("woff2"), url("#{$inter-font-path}/Inter-LightItalic.woff#{$inter-font-path-suffix}") format("woff"); } } @mixin weight-300 { @include weight-300-normal; @include weight-300-italic; } @mixin weight-400-normal { @font-face { font-family: 'Inter'; font-style: normal; font-weight: 400; font-display: $inter-font-display; src: url("#{$inter-font-path}/Inter-Regular.woff2#{$inter-font-path-suffix}") format("woff2"), url("#{$inter-font-path}/Inter-Regular.woff#{$inter-font-path-suffix}") format("woff"); } } @mixin weight-400-italic { @font-face { font-family: 'Inter'; font-style: italic; font-weight: 400; font-display: $inter-font-display; src: url("#{$inter-font-path}/Inter-Italic.woff2#{$inter-font-path-suffix}") format("woff2"), url("#{$inter-font-path}/Inter-Italic.woff#{$inter-font-path-suffix}") format("woff"); } } @mixin weight-400 { @include weight-400-normal; @include weight-400-italic; } @mixin weight-500-normal { @font-face { font-family: 'Inter'; font-style: normal; font-weight: 500; font-display: $inter-font-display; src: url("#{$inter-font-path}/Inter-Medium.woff2#{$inter-font-path-suffix}") format("woff2"), url("#{$inter-font-path}/Inter-Medium.woff#{$inter-font-path-suffix}") format("woff"); } } @mixin weight-500-italic { @font-face { font-family: 'Inter'; font-style: italic; font-weight: 500; font-display: $inter-font-display; src: url("#{$inter-font-path}/Inter-MediumItalic.woff2#{$inter-font-path-suffix}") format("woff2"), url("#{$inter-font-path}/Inter-MediumItalic.woff#{$inter-font-path-suffix}") format("woff"); } } @mixin weight-500 { @include weight-500-normal; @include weight-500-italic; } @mixin weight-600-normal { @font-face { font-family: 'Inter'; font-style: normal; font-weight: 600; font-display: $inter-font-display; src: url("#{$inter-font-path}/Inter-SemiBold.woff2#{$inter-font-path-suffix}") format("woff2"), url("#{$inter-font-path}/Inter-SemiBold.woff#{$inter-font-path-suffix}") format("woff"); } } @mixin weight-600-italic { @font-face { font-family: 'Inter'; font-style: italic; font-weight: 600; font-display: $inter-font-display; src: url("#{$inter-font-path}/Inter-SemiBoldItalic.woff2#{$inter-font-path-suffix}") format("woff2"), url("#{$inter-font-path}/Inter-SemiBoldItalic.woff#{$inter-font-path-suffix}") format("woff"); } } @mixin weight-600 { @include weight-600-normal; @include weight-600-italic; } @mixin weight-700-normal { @font-face { font-family: 'Inter'; font-style: normal; font-weight: 700; font-display: $inter-font-display; src: url("#{$inter-font-path}/Inter-Bold.woff2#{$inter-font-path-suffix}") format("woff2"), url("#{$inter-font-path}/Inter-Bold.woff#{$inter-font-path-suffix}") format("woff"); } } @mixin weight-700-italic { @font-face { font-family: 'Inter'; font-style: italic; font-weight: 700; font-display: $inter-font-display; src: url("#{$inter-font-path}/Inter-BoldItalic.woff2#{$inter-font-path-suffix}") format("woff2"), url("#{$inter-font-path}/Inter-BoldItalic.woff#{$inter-font-path-suffix}") format("woff"); } } @mixin weight-700 { @include weight-700-normal; @include weight-700-italic; } @mixin weight-800-normal { @font-face { font-family: 'Inter'; font-style: normal; font-weight: 800; font-display: $inter-font-display; src: url("#{$inter-font-path}/Inter-ExtraBold.woff2#{$inter-font-path-suffix}") format("woff2"), url("#{$inter-font-path}/Inter-ExtraBold.woff#{$inter-font-path-suffix}") format("woff"); } } @mixin weight-800-italic { @font-face { font-family: 'Inter'; font-style: italic; font-weight: 800; font-display: $inter-font-display; src: url("#{$inter-font-path}/Inter-ExtraBoldItalic.woff2#{$inter-font-path-suffix}") format("woff2"), url("#{$inter-font-path}/Inter-ExtraBoldItalic.woff#{$inter-font-path-suffix}") format("woff"); } } @mixin weight-800 { @include weight-800-normal; @include weight-800-italic; } @mixin weight-900-normal { @font-face { font-family: 'Inter'; font-style: normal; font-weight: 900; font-display: $inter-font-display; src: url("#{$inter-font-path}/Inter-Black.woff2#{$inter-font-path-suffix}") format("woff2"), url("#{$inter-font-path}/Inter-Black.woff#{$inter-font-path-suffix}") format("woff"); } } @mixin weight-900-italic { @font-face { font-family: 'Inter'; font-style: italic; font-weight: 900; font-display: $inter-font-display; src: url("#{$inter-font-path}/Inter-BlackItalic.woff2#{$inter-font-path-suffix}") format("woff2"), url("#{$inter-font-path}/Inter-BlackItalic.woff#{$inter-font-path-suffix}") format("woff"); } } @mixin weight-900 { @include weight-900-normal; @include weight-900-italic; } @mixin all { @include weight-100; @include weight-200; @include weight-300; @include weight-400; @include weight-500; @include weight-600; @include weight-700; @include weight-800; @include weight-900; } @mixin normal { @include weight-100-normal; @include weight-200-normal; @include weight-300-normal; @include weight-400-normal; @include weight-500-normal; @include weight-600-normal; @include weight-700-normal; @include weight-800-normal; @include weight-900-normal; } @mixin italic { @include weight-100-italic; @include weight-200-italic; @include weight-300-italic; @include weight-400-italic; @include weight-500-italic; @include weight-600-italic; @include weight-700-italic; @include weight-800-italic; @include weight-900-italic; }