🎨 Curated list of awesome Sass and SCSS frameworks, libraries, style guides, articles, and resources.
This page lists names, links and short descriptions. The original list on GitHub is the source and belongs to its authors.
is an extension of CSS that adds power and elegance to the basic language. It allows you to use variables, nested rules, mixins, inline imports, and more, all with a fully CSS-compatible syntax. Sass helps keep large stylesheets well-organized, and get small stylesheets up and running quickly.
Official Sass and SCSS guide.
Learn SASS in 15 minutes tutorial.
Learn Sass with Codecademy.
Learn how to use Sass, from beginner basics to advanced techniques, with online video tutorials taught by industry experts.
Official Sass and SCSS Documentation Reference.
SitePoint Sass and SCSS reference.
What’s the difference between Sass and SCSS?
Which syntax is better?
What's the difference between SCSS and Sass?
Framework for building the foundation for a package based CSS workflow.
Bootstrap version 4, the most popular HTML, CSS, and JS framework for developing responsive, mobile first projects on the web.
Official Sass port of Bootstrap 2 and 3.
Modern CSS framework based on Flexbox.
A component and utility centric SCSS framework designed for rapid prototyping.
The most advanced responsive front-end framework in the world. Quickly create prototypes and production code for sites that work on any kind of device.
Universal and lightweight stylesheet starter kit that focuses on base html elements and typography.
Open source Sass-based OOCSS framework built for scale.
Kickoff is a lightweight front-end framework for creating scalable, performant and responsive sites.
Modern responsive front-end framework based on Material Design.
Minimal, responsive, style-agnostic CSS framework.
SCSS framework built to provide base styles, CSS components, and rapid static prototyping for Dropbox.
Micro SCSS library to help you build websites, without all the arbitrary selectors.
Lightweight, responsive, Sass-based, BEM-syntax grid system.
Simple, fluid, nestable, flexible, Sass-based, responsive grid system.
Extremely flexable CSS grid constructor.
Flexbox grid system.
Simple fractional grid system for Sass and Stylus.
Lightweight semantic grid framework built with Sass.
Sass flexible grid system.
SCSS flexible grid system.
Responsive layout toolkit for Sass.
Flexible and lightweight grid framework from the creator of animate.css.
Easy to use flexbox grid system.
Breakpoint makes writing media queries in Sass super simple.
Simple, elegant and maintainable media queries.
An extreamly powerful but easy to use Sass media query mixin.
Collection of useful media queries mixins for Sass (including iOS devices, TVs and more).
Sass mixin that helps you compose media queries in an elegant way.
Open color is a color scheme for UI design. Available in CSS, SCSS, LESS, Stylus, Adobe library, Photoshop/Illustrator swatches and Sketch palette.
Advanced color manipulation and contrast calculation in vanilla Sass.
Using standard color blending functions in Sass.
Set text on the web to a baseline grid with Sass & rems using a responsive modular-scale.
Super easy to use Sass mixins to establish a typographic system with modular scale and vertical rhythm. Based on the Gridlover app.
Typography made easy. A vertical rhythm library.
Sass mixin to make responsive typography easy.
Port of Dan Eden's Animate.css for SASS.
Collection of CSS3 powered hover animated effects to be applied to links, buttons, logos, SVG, featured images and so on. Available in CSS, Sass, and LESS.
Sass mixin library for creating keyframe-based animations from maps.
Sass mixin for creating animated hamburger icon.
Set of SCSS mixins for single element loaders and spinners.
Sass mixin for creating angled edges on sections by dynamically encoding SVGs.
Simple and lightweight mixin library for Sass.
A flexible Sass mixin for creating BEM-style buttons.
CSS button library built using Sass and Compass.
A SCSS library to help you build modular CSS that generates your selectors for you and deals with specificity automatically.
Set of 26 smart Sass mixins which will help you to manage the style of :nth-child’ified elements, in an easy and classy way.
A Sass mixin library to help you create modern web sites.
Collection of Sass mixins and functions.
Modular scale calculator built into your Sass.
Sass/Compass version of Normalize.css, a collection of HTML element and attribute rulesets to normalize styles across all browsers.
SCSS/CSS library to beautify checkbox and radio buttons.
JavaScript, SCSS, Sass, Less, and Stylus helpers for rendering high-resolution image variants.
Accoutrement modules are Sass toolkits that work together to form the central configuration of a project. The tools can be used individually, or integrated for extra power.
Sass mixin that helps managing code deprecation.
Set of mixins for those who want to mess around with flexbox using the native support of current browsers.
The Sass implementation of lodash (API documentation).
Collection of Sass utilities to ease and improve the implementations of common style-code patterns.
Guidelines for writing sane, maintainable and scalable Sass.
Guidelines in use at BigCommerce.
Sass and CSS style guide by Airbnb.
Dropbox’s (S)CSS authoring style guide.
Records of Hugo Giraudel's works on Sass.
(February 2, 2015)
Dart implementation of Sass.
Dependency management built for Sass, Less, and CSS.
Binding of libsass for Python.
C/C++ implementation of a Sass compiler.
Custom node-sass importer for selector specific imports, node importing, module importing, globbing support and importing files only once.
Node.js bindings to libsass.
Navigate through *.scss and *.sass files efficiently with the OctoLinker browser extension for GitHub.
Extract variables from scss files. Use scss to describe styles for use in javascript by extracting computed styles into js objects. Supports imports and advanced language features.
Sass loader for webpack.
Ruby on Rails stylesheet engine for Sass.
Documentation system (like JSDoc for JavaScript) to build pretty and powerful docs in the blink of an eye.
Process your Sass and SCSS files into CSS without needing any knowledge of the command line.
Configurable tool for writing clean and consistent SCSS. (deprecated)
P/Invoke .NET wrapper around libsass to convert SCSS to CSS supporting NET2.0/NET3.5/NET4.x+ and CoreCLR platform.
A mighty, modern CSS linter that helps you enforce consistent conventions and avoid errors in your stylesheets. Supports CSS-like syntaxes, including SCSS.
vuejs/awesome-vue
🎉 A curated list of awesome things related to Vue.js
VoltAgent/awesome-design-md
A collection of DESIGN.md files analysis by popular brand design systems. Drop one into your project and let coding agents generate a matching UI.
PatrickJS/awesome-angular
:page_facing_up: A curated list of awesome Angular resources
AdrienTorris/awesome-blazor
Resources for Blazor, a .NET web framework using C#/Razor and HTML that runs in the browser with WebAssembly.
AllThingsSmitty/must-watch-css
CSS talks you have to see covering CSS Grid, flexbox, custom variables, performance, frameworks, tooling, and more! 📺
jondot/awesome-react-native
Awesome React Native components, news, tools, and learning material!