Simplify Sass Development with Dropbox’s Scooter Framework

Note: Scooter has been deprecated.

We all know about CSS frameworks and the power they offer developers. But, what about SCSS frameworks that tie into the Sass workflow?

There aren’t many of these frameworks around but Scooter is a nice exception. It’s maintained by the folks at Dropbox and it works just like a frontend UI framework but with one caveat—it’s all built on SCSS.

scooter home page

The team at Dropbox created this library as a way to consolidate their UI work and make it easier to customize. They have a CSS style guide which covers the basics of creating new classes, nesting, spacing, and general writing guidelines.

Naturally, these guidelines also apply to SCSS, and it’s really more of a user’s manual than an introduction. Unfortunately, there is no single intro for beginners. Instead, there are pages with information about the library, such as custom functions for page colors.

The Scooter library isn’t hard to pick up if you already know Sass. If you’re a complete newbie then you’ll need to look into the basics of Sass first.

Scooter is still a very new project so there’s room for growth. It has plenty of detailed objects such as grids, media boxes, list items, and components like buttons/field inputs.

scooter buttons scss

The Scooter library is half SCSS development framework, half UI component library. It’s a unique twist against the traditional stuff like Bootstrap.

I’d only recommend this for advanced developers who like digging into frameworks for fun. Scooter is not great for production projects and it’s really made to be an extension of Dropbox’s development team.

But, if you wanna dig further, check out the official GitHub repo with all the included files and a free download to grab the source code.