Jump to main content

A simple, extensible CSS framework

Backed by open-source code and written in Sass by the Canonical Web Team.

Lightweight

Vanilla contains a responsive CSS grid, basic style for HTML elements and a selection of key useful patterns and utility classes that you can extend.

Composable

Designed to be composable — you can include the whole framework to avail of all styles or you can use only what you need for your project.

Open source

Anyone can contribute to Vanilla, improve it and extend it. All the code is available on GitHub and is licensed under LGPLv3 by Canonical.

Quick start

The recommended method of including Vanilla Framework in your project is via npm or yarn. You can then simply include the framework in your SCSS files and compile.

For other methods, please see the advanced usage docs.

yarn add sass vanilla-framework
@import "vanilla-framework";
@include vanilla;

Guidelines

If you are contributing to Vanilla, make sure to read and follow these guidelines.

Downloads

GitHub repo:

Vanilla Framework

Use our CSS framework to start building your project.

Download latest Vanilla v3.4.0

See the release notes for details on the latest updates.
Sketch library:

Vanilla Design

Get our Sketch library of common design components.

Download the Sketch UI Kit

The Sketch UI Kit is no longer maintained. Current version is compatible with Vanilla v2.25.

Latest news from our blog

Loading...

View more from our blog

Who’s using Vanilla

Get involved

Subscribe to Vanilla updates

Know about new releases, features, blog posts, calls‑for‑help and more.