Skip to content
41

Awesome Less

:sunglasses: A curated list of awesome {Less}

68 stars7 forks151 entriesLast push Aug 16, 2022 (4 years ago)License CC0-1.0

This page lists names, links and short descriptions. The original list on GitHub is the source and belongs to its authors.

Getting Started

Beginner's Guide

Getting Started with Less

Learn in 10 Minutes

Official Guide

In 2 lists

Official Repository

Backwards compatible with CSS, and the extra features it adds use existing CSS syntax.

In 4 lists

UI/Theme Frameworks and Components

1pxdeep

Brings designing by relative visual weight, or designing with color schemes, to Bootstrap.

Ant Design

An enterprise-class UI design language and React-based implementation.

In 5 listsDetails

Bootstrap a11y theme

Makes web accessibility easier for Bootstrap developers.

Bootstrap 3

Bootstrap is the most popular HTML, CSS, and JS framework for developing responsive, mobile first projects on the web.

In 3 lists

Bootswatch

Collection of free themes for Bootstrap.

In 2 lists

Cardinal

Small "mobile first" CSS framework for front-end developers who build responsive web applications.

CSSHórus

Library for development of responsive and mobile websites.

Flat UI Free

Theme and framework for Bootstrap.

JBST

Theme framework that can be used as a standalone website builder or to create WordPress themes.

Less Rails

Less for Rails.

In 2 lists

Material Design for Bootstrap

Material Design for Bootstrap is a Bootstrap V3 compatible theme; it is an easy way to use the new Material Design guidelines by Google in your Bootstrap 3 based application.

In 2 lists

Metro UI CSS

Set of styles to create a site with an interface similar to Windows 8.

Schema

Light, responsive, and lean frontend UI framework.

Semantic UI

UI component framework based around useful principles from natural language.

In 2 lists

UIkit

Lightweight and modular front-end framework for developing web interfaces.

In 4 lists

Wee

Lightweight front-end framework for logically building complex, responsive web projects.

Libraries and Mixins >Grid

Bootstrap Grid Only

Bootstrap's responsive grid and responsive utility classes only, without any extras. Lightweight yet still powerful. Style to taste.

Framework

Less Framework is a CSS grid system for designing adaptive web sites. It contains 4 layouts and 3 sets of typography presets, all based on a single grid.

Flexible Grid System

This framework will let you create your web applications in a flexible way that you've never experienced before.

Fluidable

Fluidable is a mobile first, responsive grid system. It is standalone, lightweight & built using Less.

Grid System

Super-easy to use, markup-independent grid system.

Less Zen Grid

Implementation of Zen Grids in Less.

Order.Less

Baseline alignment, column grids and modular scales.

Libraries and Mixins >Media Queries

CSS and Media Query Strategies

Using Less CSS to develop a media query driven solution for modern and legacy browsers.

Media Queries Library

Really simple media queries in Less.

Media Query to Type

A method for creating an IE specific stylesheet that allows the content of media queries to become accessible to Internet Explorer 8 and below.

Libraries and Mixins >Color

Brand Colors

1100+ collection of popular brand colors available in Sass, Less, Stylus and CSS.

More-Colors

Variables for easier color manipulation while you design in the browser.

Open Color

Open color is a color scheme for UI design. Available in CSS, SCSS, Less, Stylus, Adobe library, Photoshop/Illustrator swatches and Sketch palette.

In 2 lists

Libraries and Mixins >Animation

Animate

A library of CSS3 keyframe animations authored using Less.

Animate Less

Port of Dan Eden's Animate.css to Less.

Cube Less

3D (animated) cube using only CSS (Less), originally used by LeanCloud (aka. AVOS Cloud).

In 2 lists

Hover

Collection of CSS3 powered hover animated effects to be applied to links, buttons, logos, SVG, featured images and so on.

In 3 lists

Less Burguer

Port of Sass Burger to Less.

Libraries and Mixins >Miscellaneous

3L

Mixins library.

Bidi

Set of mixins for creating bi-directional styling.

Clearless

Collection of mixins.

Css3LessPlease

Conversion of css3please.com to Less mixins.

CssEffects

Collection of CSS style effects.

Cssowl

Mixin library.

Dynamic Stylesheet

Set of useful mixins.

Est

Mixin library.

Hexagon

Generate CSS hexagons with custom size and color.

Homeless

Helpful functions.

Less Elements

Set of basic mixins.

Lesshat

Smart mixins library.

Lessley

A jasmine like testing suite written in pure Less.

Lessmore

Mixins library. Cross-browser support for the CSS3 features and more.

Normalize

Modularized famous normalize.css using Less.

Oban

Collection of mixins.

Preboot

Collection of mixins and variables for writing better CSS.

Retina.js

JavaScript, SCSS, Sass, Less, and Stylus helpers for rendering high-resolution image variants.

In 2 lists

Shape

Collection of mixins for various shapes.

TRRtoolbelt

Mixins and functions for common actions.

Style Guides

Handshake Style Guide

This guide presents a collection of best-practices and coding conventions.

WebMD Health Services Style Guide

This document outlines CSS/Less best practices at WebMD Health Services.

Ports of Less >Java

JLessC

Less compiler written completely in Java.

Less Engine

Runs Less in the Rhino JVM-based JavaScript interpreter.

Less CSS Compiler for Java

Runs Less in the Rhino JVM-based JavaScript interprete.

Less4j

Native Java implementation.

Lesscss

Runs Less using Rhino, Nasshorn or node.js engine; 1.7.0 compliant.

Lesscss Gradle Plugin

Gradle plugin based on Less.

Ports of Less >.Net

BundleTransformer.Less

Compiler written in .Net.

Less CSS for .Net

Compiler written in .Net.

Ports of Less >PHP

ILess

PHP port written in Javascript.

Lessphp

Compiler written in PHP.

Less.php

PHP port.

Ports of Less >Python

Pyhton Compiler

Compiler written in Python.

Ports of Less >Ruby

Ruby Compiler

Less in Ruby's V8 Engine.

In 2 lists

Ports of Less >Go

Go Compiler

Runs Less inside embedded Javascript engine.

GUIs, Editors and Plugins

Atom Linter

Linter plugin in the Atom text editor.

CSS 2 Convert

Quick way to automatically convert CSS to Less, easy as copy and paste.

CSS Less(ish)

Sublime Text 2 & 3 plugin that implements a stripped down version of the functionality in css preprocessors (such as Less).

Crunch 2!

Crunch 2 is a cross-platform (Windows, Mac, and Linux) editor with integrated compiling. If you work with large Less projects, you should definitely try it out, as you only need the free version for Less files.

Diamond

Dependency management built for Sass, Less, and CSS.

In 2 lists

Eclipse Less Plugin

This plugin extends the Eclipse IDE by providing handy features to edit and compile Less stylesheets.

Eclipse Transpiler Plugin

Eclipse plugin to automatically transpile your files (Less, SASS, CoffeeScript, etc.).

Emacs

Emacs mode with support for compile-on-save.

Grunt Contrib

Compile Less files to CSS using Grunt.

Grunt Lint

Lint your Less files using CSS Lint from Grunt.

Gulp Less

Plugin for Gulp.

In 2 lists

Hayaky

Hayaku is a bundle of useful scripts aiming for rapid front-end web development.

Hyra Helper

CakePHP plugin that converts your Less files to CSS using only PHP.

Koala

Koala is a cross-platform GUI application for compiling Less, sass and coffeescript.

Less for Notepad++

Syntax Highlighting for Notepad++.

Less Sublime

Syntax highlighting for Sublime Text.

Lesshint

Tool to aid you in writing clean and consistent Less.

LiveReload

CSS edits and image changes apply live. CoffeeScript, SASS, Less and others just work.

In 2 lists

SimpleLess

SimpleLess is a minimalistic Less compiler. Just drag, drop and compile.

Sublime Less2CSS

Sublime Text 2 Plugin to compile Less files to css on save.

SublimeOnSaveBuild

Trigger a build the moment you save a file in Sublime Text 2. Works best with web projects that make use of Less, Compass and any other pre-processor or a makefile.

Vim Less

This vim bundle adds syntax highlighting, indenting and autocompletion.

Visual Studio Web Essentials

If you ever write CSS, HTML, JavaScript, TypeScript, CoffeeScript or Less, then you will find many useful features that make your life as a developer easier.

In 2 lists

Winless

WinLess started out as a clone of Less.app, it takes a more feature-complete approach and has several settings. It also supports starting with command line arguments.

Online Less Compilers

BeautifyTools Less Compiler

Online Less compiler with optional formatting and minification at BeautifyTools.

EstFiddle

Online Less compiler providing live demo for Less and est. Allowing users to switch among all versions of Less after 1.4.0 with optional est/Autoprefixer functionalities.

ILess

Live demo of ILess PHP compiler.

Leafo

Lessphp live demo.

Less2CSS

Online Integrated Development Environment (IDE) that is hosted in a browser allowing users to edit and compile Less to CSS in real-time.

LessPHP

Less.php live demo.

Lesstester

Online compiler for Less CSS.

Precess

A real time preprocesser compiler.

Winless

This Online Less Compiler can help you to learn Less. You can go through the examples below or try your own Less code.

Online Web IDEs/Playgrounds with Less support

CodePen

CodePen is a playground for the front end side of the web..

In 6 listsDetails

CSSDeck Labs

CSSDeck Labs is a place where you can quickly create some experiments (or testcases) that involves HTML, CSS, JS code.

Fiddle Salad

An online playground with an instantly ready coding environment.

JS Bin

JS Bin is a webapp specifically designed to help JavaScript and CSS folk test snippets of code.

In 4 lists

JsFiddle

Online Web Editor.

Translations

Chinese (中文)

Danish

German

Indonesian

Iranian

Japanese

Polish

Spanish

Vietnamese

Articles

An Introduction To Less, And Comparison To Sass

Best Less Tutorials : A Comprehensive Guide to Less

Doing MORE with Less

How to Make a Loops in Less CSS

Lets use Less to Create Less CSS not just CSS

Revisiting Less

Articles >Books

Instant Less CSS Preprocessor How-to

Less Web Development Essentials

Learning Less

Videos

Learning Less

Less (CSS pre-processor) Tutorials

Less CSS Tutorials for Beginners

Less CSS - Tutorials for Beginners

Experiments

3D Buttons

Border Radiuses Mixin

CSS3 Color Wheel

DEMO: Variables

Easy Buttons

Linear Gradient Mixin

Navbar

Responsive Grid

Sizable CSS-only Icons

Triangle / Arrow Mixin

More...

Community

Official Repository

Backwards compatible with CSS, and the extra features it adds use existing CSS syntax.

In 4 lists

Freenode

Medium

Quora

Stack Overflow

Twitter

See category
93

Awesome Vue

vuejs/awesome-vue

🎉 A curated list of awesome things related to Vue.js

Fresh★ 74k1067 entriesPushed 5 days ago
93

Awesome DESIGN.md

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.

Fresh★ 119k74 entriesPushed 9 days ago
91

Awesome Angular

PatrickJS/awesome-angular

:page_facing_up: A curated list of awesome Angular resources

Fresh★ 10k1944 entriesPushed today
90

Awesome Blazor

AdrienTorris/awesome-blazor

Resources for Blazor, a .NET web framework using C#/Razor and HTML that runs in the browser with WebAssembly.

Fresh★ 9.4k375 entriesPushed today
88

Must-Watch CSS

AllThingsSmitty/must-watch-css

CSS talks you have to see covering CSS Grid, flexbox, custom variables, performance, frameworks, tooling, and more! 📺

Fresh★ 4.9k70 entriesPushed 6 days ago
87

Awesome React Native

jondot/awesome-react-native

Awesome React Native components, news, tools, and learning material!

Fresh★ 36k194 entriesPushed 1 month ago