Lighter

Lightweight, Flexible, and Modern Css framework

V2.0


Everything you need to create a responsive website




Support Lighter on GitHub with only one Star, We encourage to do better than this

Responsive web design (RWD) is an approach to web design which makes web pages render well on a variety of devices and window or screen sizes. Recent work also considers the viewer proximity as part of the viewing context as an extension for RWD. Content, design and performance are necessary across all devices to ensure usability and satisfaction.

__ From Wikipedia

Lightweight

At less than 15 kb, Lighter is very light compared to the others frameworks.

Modern

Lighter is created to be compatible with all browsers. Safari, Chrome ...

Responsive

Lighter is tested on different devices to be compatible with all apparatus.

Faster

Lighter is created to make the developement easy and faster.

one

eleven

two

ten

three

nine

four

eight

five

seven

six

six

twelve

Built with SASS

Lighter is built with simplified Sass, Sass is the most mature, stable, and powerful professional grade CSS extension language in the world.

Sass is completely compatible with all versions of CSS. We take this compatibility seriously, so that you can seamlessly use any available CSS libraries.

Learn more >

Coming Soon !

Learn Lighter

Learn how to create a responsive website using Lighter.

This Tutoriel make you understand the basics of Lighter, and let you getting started with the framework, at the end of this tutorial you will be able to create a beautiful responsive website.

  • days
  • Hours
  • Minutes
  • Seconds

Easy to learn
Easy to use
Lightweight 13KB
Open source
12 colmun Grids
Responsive
No Javascript
Built with SASS

- License

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software...

For More information : MIT License.

- SASS

Structure of Lighter Sass :

|---- scss
   |---- src
      |---- components
          |---- accordion.scss
          |---- block.scss (Blockquotes)
          |---- buttons.scss
          |---- cards.scss
          |---- code.scss
          |---- forms.scss
          |---- navbar.scss
          |---- progressBar.scss
          |---- table.scss
      |---- core
          |---- base.scss 
          |---- reset.scss (Normalize.css)
          |---- variables.scss 
      |---- layout
          |---- grids.scss 
      |---- utilities
          |---- helpers.scss
          |---- image.scss
          |---- list.scss
          |---- spacing.scss
          |---- typo.scss (Typography) 
      |---- lighter.scss