bourbon - A Lightweight Sass Tool Set

•    Ruby

---

Bourbon is a library of Sass mixins and functions that are designed to make you a more efficient style sheet author. Alternatively, you can install Bourbon with Bower.

sass bourbon-family css scss bourbon sass-mixins sass-library sass-functions eyeglass-module mixins

neat - A lightweight and flexible Sass grid

•    CSS

---

Neat is a fluid grid framework with the aim of being easy enough to use out of the box and flexible enough to customize down the road. Alternatively, you can install Neat with Bower.

scss sass grid bourbon grid-framework css bourbon-family columns layout media media-queries neat queries semantic eyeglass-module

sass-build-structure - An example SASS build structure sample to start a project

•    CSS

---

After reading the book SMACSS and finding it very helpful the Front End team at Evernote has used some of the ideas in our SASS build. We've found breaking the SASS files out into directories (Base, Layout, Modules, and Views) helps organize our files in a project and compile CSS into a clean, logical file. Each page has a SASS (.scss) file created that acts as a project file that imports the individual modular components from Base, Layout, Modules, and Views that are needed to build the particular page. This build methodology is currently being used on Evernote.com.

sass css structure template smacss evernote web front-end scss

Spectre.css - A Lightweight, Responsive and Modern CSS Framework

•    CSS

---

Spectre.css is a lightweight, responsive and modern CSS framework. Spectre is a side project based on years of CSS development work on a large web service project. Spectre only includes modern base styles, responsive layout system, CSS components and utilities, and it can be modified for your project with Sass/Scss compiler.

spectre css css-framework responsive-grid flexbox utilities modern lightweight framework responsive mobile-friendly front-end sass

some-like-it-neat - A WordPress Theme Using _s, Bourbon + Neat and Theme Hook Alliance

•    PHP

---

Some Like it Neat is a Minimal Starter theme that is Responsive out of the box. It uses Sass along with Bourbon Neat for help with Responsive grids. It's based on _s and is pretty rad. Bourbon provides a lightweight Sass library (similar to Compass).

spaceBase - A Sass-based responsive CSS framework.

•    CSS

---

Many CSS frameworks are meant to be included and left alone. But spaceBase is a boilerplate layer that can be built upon and tailored for your needs. It combines best practices for today’s responsive web with the core components we use on every project. Consider it the launch pad for your adventures into cyberspace. spaceBase is the front-end starter files for any new web project. It sets up your Sass architecture and normalizes your CSS and native HTML elements. It provides the structural groundwork for your application.

css sass flexbox responsive front-end framework space150

foundation-sites - The most advanced responsive front-end framework in the world

•    HTML

---

Foundation is the most advanced responsive front-end framework in the world. Quickly go from prototype to production, building sites or apps that work on any kind of device with Foundation. Includes a fully customizable, responsive grid, a large library of Sass mixins, commonly used JavaScript plugins, and full accessibility support. Foundation has three kinds of tests: JavaScript, Sass, and visual regression. Refer to our testing guide for more details.

css scss sass js responsive mobile-first framework eyeglass-module handlebars-helper-rel handlebars-helper-slugify

neat - A semantic, fluid grid framework on top of Sass and Bourbon

•    Ruby

---

A semantic, fluid grid framework on top of Sass and Bourbon

material - Material Design for Bootstrap 4

•    CSS

---

Daemonite's Material UI is a cross-platform and fully responsive front-end interface based on Google Material Design developed using Bootstrap 4. The basic idea behind this project is to combine the front-end technology of the popular Bootstrap framework with the visual language of Google Material Design.

material google-material css bootstrap-components bootstrap framework front-end html js sass

mini.css - A minimal, responsive, style-agnostic CSS framework!

•    CSS

---

mini.css is a lightweight CSS framework (under 7KB gzipped) designed with mobile devices and modern browsers in mind. Responsiveness, ease of use and customization are some of the main features of the framework, while accessibility and extensive documentation are some of the secondary focuses of the project. The framework is written using Sass, while most of its components are based on Flexbox. For instructions on how to use, best practices, templates and other usage information, please visit the framework's documentation.

css framework front-end frontend responsive web-development sass mini sass-framework css-framework minimal style-agnostic toolkit mini.css

pixel-bootstrap-ui-kit - Pixel UI Kit - Free and open source Bootstrap 5 UI Kit without jQuery

•    HTML

---

Pixel is a free, fully responsive, modern Bootstrap UI Kit that will help you build creative and professional websites. Use our components and sections, switch some Sass variables to build and arrange pages to best suit your needs. Pixel is a premium extension of the famous Bootstrap CSS Framework featuring pricing cards, profile cards, timelines and many more and additional plugins for datepickers and input sliders which Bootstrap does not have by default.

gulp sass bootstrap ui-kit bootstrap-4 bootstrap-ui-kit pixel-lite bootstrap-4-ui-kit bootstrap-5 bootstrap-5-ui-kit components elements responsive front-end css web

concise

•    CSS

---

Concise CSS is a lightweight CSS framework that provides a number of great features without the bloat. Concise CSS provides a solid foundation to stylize your website. It offers an alternative to frameworks like Bootstrap and Foundation, with the difference that Concise only includes the minimum styles required. That does not mean that the features are limited; is possible to use add-ons on top of the core to extend the functionality as required.

css framework postcss sass design minimalist scss mobile-first responsive front-end web lightweight

Milligram - A minimalist CSS framework.

•    HTML

---

Milligram is a minimalist CSS framework and it provides a minimal setup of styles for a fast and clean starting point. It is specially designed for better performance and higher productivity with fewer properties to reset resulting in cleaner code.

milligram css html framework css-framework design minimalist flexbox amp bootstrap css3 front-end html5 kickstarter less responsive mobile mobile-first postcss sass scss stylus

family

•    CSS

---

Family.scss is a 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. Otherwise import the Family.scss source file.

sass css nth-order scss family family.scss nth-child child nth eq nth-of-type nth-of-child selector eyeglass-module

awesome-sass - 🎨 Curated list of awesome Sass and SCSS frameworks, libraries, style guides, articles, and resources

•    

---

Curated list of awesome Sass and SCSS frameworks, libraries, style guides, articles, and resources. Sass 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.

sass scss css

maxmertkit - Maxmertkit, powerful, most customizable and easiest for usage mobile first front-end framework for web-development

•    CSS

---

Maxmertkit, powerful, most customizable and easiest for usage mobile first front-end framework for web-development, created by Vetrenko Maxim, and maintained by the core team with the support and involvement of the community. Read the Start page for information on the framework contents, howto videos, examples, and more.

css sass js framework css-framework maxmert maxmertkit mobile-first responsive front-end web html5 coffeescript

hayaku - Fuzzy abbreviations, support for preprocessors (Sass, Less, Stylus) and a lot of other features in easily configurable set of tools for writing CSS faster

•    Python

---

Hayaku is a bundle of useful scripts aiming for rapid front-end web development. The main aim of Hayaku is to create the fastest way to write and maintain CSS code in an editor.

sublime-text-3 sublime-package snippets abbreviations css auto-complete

css - The CSS design system that powers GitHub

•    CSS

---

Primer is the CSS framework that powers GitHub's front-end design. primer includes 23 packages that are grouped into 3 core meta-packages for easy install. Each package and meta-package is independently versioned and distributed via npm, so it's easy to include all or part of Primer within your own project.

css sass ui-components framework design-system design-systems primer github

node-sass - :rainbow: Node.js bindings to libsass

•    C++

---

Node-sass is a library that provides binding for Node.js to LibSass, the C version of the popular stylesheet preprocessor, Sass. It allows you to natively compile .scss files to css at incredible speed and automatically via a connect middleware.

node-sass libsass scss sass-files scss-files css preprocessor sass style

oruga - 🐛 Oruga is a lightweight library of UI components without CSS framework dependency

•    Vue

---

Oruga doesn't depend on any specific style or CSS framework (like Bootstrap, Bulma, TailwindCSS etc...) and it doesn't provide any grid system or CSS utility, it just offer a set of components easy to customize. Oruga wants you to focus only on UI/UX aspects of your application and be totally flexible to future changes without having to touch a line of JavaScript. Browse online documentation here.

css sass vuejs ui vue customization frontend ux scss css-framework agnostic ui-components tailwindcss oruga