Cascade Framework

From Wikipedia, the free encyclopedia
Jump to: navigation, search
Cascade Framework
Cascade Framework Logo.png
Cascade logo
Cascade Framework.png
Cascade Framework
Developer(s) John Slegers
Initial release March 2013; 2 years ago (2013-03)
Stable release 1.6 / December 17, 2014; 11 months ago (2014-12-17) [1]
Development status Active
Written in HTML, CSS and JavaScript
Operating system Cross-platform
Size 10.6 KB (archived)
Type HTML and CSS-based design templates
License MIT License

Cascade Framework is a free CSS framework for creating websites and web applications. Similar to Bootstrap and Foundation, it contains a wide range of HTML and CSS-based interface components, as well as optional JavaScript extensions.


Dissatisfied with the architecture of Bootstrap and Foundation, John Slegers wanted to create an alternative that offered more flexibility and better performance without cutting back on features.[citation needed] He came up with the name Cascade Framework for his project and released it under the MIT License in March 2013.[citation needed] The last stable release is version 1.5.[2]

Cascade Framework 2 is currently under development and will involve a rewrite of the codebase into the Sass language.[3][4]


Cascade Framework 1.x is written in pure CSS. It supports responsive design and all modern browsers as well as IE6+. For an optimal balance between footprint and flexibility, it implements a modifier design pattern inspired by SMACCS and OOCSS.

Binpress lists the following key features:[5]

  • Cascade Framework is entirely based on an OOCSS architecture optimised for both performance and flexibility.
  • Cascade Framework contains advanced components like “panels”, “tab blocks” and “navigation” components that can be combined in various ways.
  • Cascade Framework is design agnostic. You can choose the default theme, create one of your own or just work with your own project specific custom design and leave out the default theme entirely. Both typography and color scheme are separated in separate modules to suit that purpose.
  • Cascade Framework allows you to choose between a Semantic Grid technique and a presentational grid technique. Twitter Bootstrap offers only a presentational grid technique.
  • With Cascade Framework, you can use any number of columns you want (1,2,3,4,5,6,7,8,9,10,12,16 and 24 columns are supported) throughout your project and nest them freely.
  • Cascade Framework’s grid uses a special padding element for its gutter, which combined with the media object integration makes the grid both more powerful and easier to use than any other grid system.
  • The total CSS code of Cascade Framework is only 9712 bytes minified and gzipped and can be further reduced if you don't need all modules. For many projects, you’ll do fine with a build of Cascade Framework with that’s only 3910 bytes.
  • Cascade Framework has a “light” version that’s no more than 2010 bytes in total. While it doesn’t contain components like panels or tabs, it still offers you a clean design for a whole bunch of elements, support for IE6, responsive behavior, etc. If you need just its grid features, you can go as lightweight as 323 bytes.
  • Cascade Framework offers support up to IE6 and there are no plans to drop support for older browsers in the near future.

Cascade Framework is open source and available on GitHub.[6][7] Developers are encouraged to participate in the project and make their own contributions to the platform.


In an article posted on October 13, 2013, Crunchify lists Cascade Framework as #5 in its "Top 5 New and Favorite Responsive Frameworks".[8] The first four are respectively Bootstrap, Cardinal, TypePlate and Furrato.

In an article posted on October 24, 2013, CodeGeekz lists it among "12 Fresh and Useful Frameworks".[9] Other projects listed are Gumby, Solved by Flexbox, UI Kit, SkelJS, Cardinal, Layers CSS, Grid Forms, Gridism, Maxmert, Rocket CSS and Kube Framework.

Linux portal Linuxlinks lists Cascade Framework as one of the ten "finest open source lightweight frameworks to kick start CSS and HTML projects".[10] Other projects listed are Quantum Framework, Pure, Baseline, HTML KickStart, Base, KNACSS, Toast, Motherplate and HTML5 Boilerplate.

Cascade Framework was Softpedia's Script of the day on September 6, 2013.[11] Softpedia's scripts tester Catalin Cimpanu[12] explains why, according to him, Cascade Framework isn't your typical framework:[11]

The Cascade CSS framework is a unique project these days. Unlike most CSS frameworks that focus on the UI, Cascade focuses on code organization and cross-browser compliance, something that most CSS frontend developers these days don't care about anymore.

While CSS framework developers has been busy in packing as much UI modules as they can in their frameworks' core, most of them forgot the main problem with Web development, a problem that's been around since the early 2000s: cross-browser compliance.

While most frameworks break when seen from a different, older browser, the Cascade Framework still renders the same and even gracefully degrades in ancient browsers.

Impossible right? Not impossible, but very possible, as this framework has proven. The biggest difference with Cascade compared to other CSS frameworks is the way code has been organized, making it super easy for developers to not only use, but also maintain the websites they build. All without breaking in older browsers.

Cascade Framework was also one of two winning submissions of a contest organised by Belgian web development company Openminds in the context of their 2013 Ruby conference, called Arrrrcamp.[13]


Cascade Framework Advanced

As of May 19, 2014, a Cascade Framework based Drupal theme has been added to the Drupal website sandbox [14] as a sandbox project.

As of October 29, 2014, Cascade Framework Advanced has been released. This Open Source project integrates Cascade Framework with JQuery UI.[15]

See also[edit]


External links[edit]