Renderkit NPM | npm.io

RenderKit

"Definitely 👌🏽 the light way for start new front-end web projects."

From a UI-Kit up in production. A light way for start new front-end web project. RenderKit is a lightweight scss framework that brings together the best front-end tools for cross browsing, accessibility and prototyping. With more than 150 configurations via scss it is the lightest way to start front-end projects.

RenderKit can also be used as styleguide and visual tester for the various @mixins installed with sections already ready for use.

Getting started

Install via NPM

npm install renderkit

SCSS Package

The following tools are included in the scss package:

Important notes: all packages including the Foundation core have been revisited and customized without any rem output. If you want to install any additional Foundation package, full functionality is not guaranteed.

If you want to completely use all the accessibility features present, you need to install what-input. For all scss documentation visit this page.

Each scss RenderKit file is fully compatible with sass-doc. You can also install the complete documentation locally!.

SCSS Quickly install

Create your scss file

@import 'path/to/renderkit/scss/renderkit';
@include scss-renderkit;

Import the config/_config.scss file, change the default and enjoy!. The details of each variable can be found and searched on this page.

CSS Quickly install

You can basic download the RenderKit css file.

The default css RenderKit includes Foundation XY-Grid and Flexbox Utilities in less than 95KB.
For a minify version download this file, less than 70KB.

If you want the version without flexbox you can download the "float" version with Foundation Float Grid.