Sign Up for Free

RunKit +

Try any Node.js package right in your browser

This is a playground to test code. It runs a full Node.js environment and already has all of npm’s 400,000 packages pre-installed, including karma-css with all npm packages installed. Try it out:

karma-css lists no main file and has no index.js, so it can't be directly required. If this is a mistake, please let us know. It may however contain internal files that you can require manually:

// require("karma-css/[??]")

This service is provided by RunKit and is not affiliated with npm, Inc or the package authors.

karma-css v1.6.2

The Official Sass Version of Karma-CSS: A Simple, Responsive Boilerplate for Mobile-Friendly Development.

Karma CSS

CircleCI npm version

Karma CSS is a mobile first, responsive CSS boilerplate framework built on top of normalize and a powerful flexbox grid system.

Our Aim

Our aim is to provide a sensible set css defaults that DO NOT impose any style on the end result. But provides enough building blocks to quickly get started and aid construction of your site.

We support all modern browsers and back to IE10, please see the full list.

Whats included?

  • Normalize
  • A powerful flex based grid system that has multiple configurable breakpoints and columns. See docs
  • Variables to:
    • customize the default look of form fields, buttons, tables, fonts and more. See docs
    • creating of additional button styles. See docs
    • defining system wide colours to use will in turn create helpers to set font and background colours to use in your html. See docs
    • easily keep track of z-index layers and avoid issues like zindex:99999. See docs
  • Several useful mixins such as:
    • responsive breakpoints
    • clearfix
    • css-triangle
    • box-shadow
    • see docs
  • Lots of additional helper classes. See docs

Samples

Though simple, with minimal effort, overriding 4 variables and adding 70 lines of css.

sample 1

Where can I read more?

The documentation can be found at karmacss.com.

Can I contribute?

We welcome all comments and contributions via Github.

Getting Started

View the getting started guide or clone the starter project on Github.

All you will need to do is

$ npm install

and

$ npm run watch

Additional installation methods include

Npm

$ npm install karma-css

Bower

$ bower install karma-css

Git

$ git clone https://github.com/accentdesign/karma-css.git

Or alternatively the CDN if you only want the defaults

<link rel="stylesheet" href="https://unpkg.com/karma-css@latest/dist/karma.min.css">

Metadata

RunKit is a free, in-browser JavaScript dev environment for prototyping Node.js code, with every npm package installed. Sign up to share your code.
Sign Up for Free