Skip to content

Instantly share code, notes, and snippets.

@cbirdsong
Created January 31, 2023 19:19
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save cbirdsong/9afa4e136d7a710b7df8ab4d128c0d19 to your computer and use it in GitHub Desktop.
Save cbirdsong/9afa4e136d7a710b7df8ab4d128c0d19 to your computer and use it in GitHub Desktop.
Generated by SassMeister.com.
$font-sizes: (
"xs": [0.89em, clamp(0.89em, calc(0.87em + 0.07vw), 0.96em)],
"sm": [1.00em, clamp(1.00em, calc(0.96em + 0.20vw), 1.20em)],
"md": [1.13em, clamp(1.13em, calc(1.05em + 0.38vw), 1.50em)],
"lg": [1.27em, clamp(1.27em, calc(1.14em + 0.61vw), 1.88em)],
"h6": [1.42em, clamp(1.42em, calc(1.24em + 0.92vw), 2.34em)],
"h5": [1.60em, clamp(1.60em, calc(1.34em + 1.33vw), 2.93em)],
"h4": [1.80em, clamp(1.80em, calc(1.43em + 1.86vw), 3.66em)],
"h3": [2.03em, clamp(2.03em, calc(1.52em + 2.55vw), 4.58em)],
"h2": [2.28em, clamp(2.28em, calc(1.59em + 3.44vw), 5.72em)],
"h1": [2.57em, clamp(2.57em, calc(1.65em + 4.59vw), 7.15em)],
);
@each $name, $sizes in $font-sizes {
.has-#{$name}-font-size {
@each $size in $sizes {
font-size: $size;
}
}
}
.has-xs-font-size {
font-size: 0.89em;
font-size: clamp(0.89em, calc(0.87em + 0.07vw), 0.96em);
}
.has-sm-font-size {
font-size: 1em;
font-size: clamp(1.00em, calc(0.96em + 0.20vw), 1.20em);
}
.has-md-font-size {
font-size: 1.13em;
font-size: clamp(1.13em, calc(1.05em + 0.38vw), 1.50em);
}
.has-lg-font-size {
font-size: 1.27em;
font-size: clamp(1.27em, calc(1.14em + 0.61vw), 1.88em);
}
.has-h6-font-size {
font-size: 1.42em;
font-size: clamp(1.42em, calc(1.24em + 0.92vw), 2.34em);
}
.has-h5-font-size {
font-size: 1.6em;
font-size: clamp(1.60em, calc(1.34em + 1.33vw), 2.93em);
}
.has-h4-font-size {
font-size: 1.8em;
font-size: clamp(1.80em, calc(1.43em + 1.86vw), 3.66em);
}
.has-h3-font-size {
font-size: 2.03em;
font-size: clamp(2.03em, calc(1.52em + 2.55vw), 4.58em);
}
.has-h2-font-size {
font-size: 2.28em;
font-size: clamp(2.28em, calc(1.59em + 3.44vw), 5.72em);
}
.has-h1-font-size {
font-size: 2.57em;
font-size: clamp(2.57em, calc(1.65em + 4.59vw), 7.15em);
}
{
"sass": {
"compiler": "dart-sass/1.32.12",
"extensions": {},
"syntax": "SCSS",
"outputStyle": "expanded"
},
"autoprefixer": false
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment