Code · 1 file
Sample SCSS File
SCSS is the CSS-compatible syntax of Sass, with variables, mixins, maps and nesting. The SCSS sample is a small program — a customer record, a VIP check and a formatted total — that is the same in every language we offer, so you can compare them side by side.
SCSS · 508 B
Sample SCSS file
An idiomatic SCSS example: a customer record type, a VIP check, a total and a formatted loop — the same program in every language we offer.
CC0 · free for any use · Verified by an independent tool · Report a problem
// Sample SCSS — samplefiles.com
@use 'sass:math';
$accent: #b0532e;
$radius: 12px;
$breakpoints: (sm: 640px, md: 960px, lg: 1280px);
@mixin respond($size) {
@media (min-width: map-get($breakpoints, $size)) {
@content;
}
}
.card {
padding: math.div(24px, 2);
border-radius: $radius;
border: 1px solid rgba($accent, 0.3);
&__title {
font-weight: 600;
color: darken($accent, 10%);
}
&:hover {
border-color: $accent;File details
Download from the command line
curl -L -o sample.scss https://files.samplefiles.com/code/scss/sample.scsswget https://files.samplefiles.com/code/scss/sample.scsshttps://files.samplefiles.com/code/scss/sample.scssprintf '%s %s\n' 7e580d7ed522c3d541dd971b90e1f3d468cb4c94c52a12226fba126b8147c993 sample.scss | shasum -a 256 -cOr check the download in your browser with the checksum calculator.