Jump to main content

Get started

You can use Vanilla in your projects in a few different ways. See Building with Vanilla and Customising Vanilla for more in-depth setup instructions.

Install

The recommended way to get Vanilla is with yarn:

yarn add vanilla-framework

Or npm:

npm install vanilla-framework

This will pull down the latest version into your local node_modules folder and save it into your project's dependencies in package.json.

You can now reference Vanilla from your main Sass file - note that the path to node_modules might be different for your project:

// Import the framework
@import 'node_modules/vanilla-framework';

// Include all of Vanilla Framework
@include vanilla;

For information on overriding settings and importing only parts of Vanilla, see Customising Vanilla.

Hotlink

You can add Vanilla directly to your markup:

<link rel="stylesheet" href="https://assets.ubuntu.com/v1/vanilla-framework-version-4.18.2.min.css" />

Download

Download the latest version of Vanilla from GitHub.

Download v4.18.2

See the release notes for details on the latest updates.

Local development

To make improvements to Vanilla itself, please follow the instructions on the project’s README.md.