Skip to content


Subversion checkout URL

You can clone with
Download ZIP
Kanso package that bundles bootstrap and font-awesome with your project.
Branch: master

Fetching latest commit…

Cannot retrieve the latest commit at this time

Failed to load latest commit information.
bootstrap @ 2dea3ed

Kanso Bootstrap with Font Awesome

This package allows you to quickly start using Twitter Bootstrap and Less in your Kanso project.


Add to your project's kanso.json dependencies setting, here is the minimal case:

"dependencies": {
    "attachments": null,
    "less-precompiler": null,
    "bootstrap-fontawesome": null

Run kanso install to install in your packages directory:

kanso install


Configure bootstrap to be compiled with Less.

Compiled CSS

Create a css/less file static/css/example.less for your site that includes bootstrap:

@import "bootstrap/less/bootstrap.less";
@baseFontPath: "../../bootstrap/font/";
/* Now use bootstrap and less! */
body { background-color: @pink; }

Include the less file in your HTML:

Note we refer to the file with a .css extention because that is what it compiles to.

    <link rel="stylesheet" type="text/css" href="static/css/example.css" />
    <h1>Hello, world!</h1>

Include a less section in your kanso.json to compile less files and attach them as css:

    "name": "example-app",
    "version": "0.0.1",
    "description": "The simplest possible app with bootstrap and less support.",
    "attachments": ["index.html", "static"],
    "less": {
        "compress": true,
        "compile": ["static/css/example.less"],
        "remove_from_attachments": true
    "dependencies": {
        "attachments": null,
        "less-precompiler": null,
        "bootstrap-fontawesome": null


In this package we updated Bootstrap to use the Font Awesome icon set. It's a little bleeding edge and is not merged with Bootstrap yet but provides you with several nice features.

The font files are include as attachments when you build your design doc, but the default path needs adjustment. To reference your font files modify your less code:

@baseFontPath: "../../bootstrap/font/";


Do a kanso push to make the build and deploy to your CouchDB:

kanso push example


You an browse the Bootstrap docs locally in the package directory under bootstrap/docs/index.html or check the website. Soon we will add the Font Awesome docs to also make them available locally, for now browse the website.



Added font-awesome, and turned on by default.

Something went wrong with that request. Please try again.