What the bleep is Leap?

Leap is a front-end framework and style guide that is used internally at Treehouse to build our app. We've architected it in a way that gives the entire Engineering team a way to quickly prototype or write front-end code. It contains atomic helper classes and components that ensure everything we build is consistent and flexible. For most thing we build, additional CSS won't be necessary. Leap gets the entire Engineering team to speak the same language, whether dev or designer.

Why build our own framework?


With well defined documentation, everyone using Leap will be on the same page. Nobody will be wondering what class to create and what styles to duplicate because it's all contained within Leap.


No longer waste time trying to get a layout to work by adding custom CSS. Let the atomic utility classes within Leap make your life easier again. Projects will get done quicker than ever.


Goodbye CSS bloat, hello clean code. Without a framework we end up duplicating various styles across multiple selectors that are specific to pages within our app. Leap lets you apply classes to markup and be done.


Designers and devs can both create rapid prototypes to help get features off the ground. From there, its easy to change how things look and feel by just making simple changes to your markup.

Wanna get going?

Before diving into using Leap, make sure you familiarize yourself with a few guidelines and best practices.

Get Started


In your project directory: bower install leap --save


Source Files Compiled CSS Compiled CSS (minified)