Fronthack is
a

to convert any design into high quality HTML and CSS.
Quick start
Current v2.1.9
View on GitHub Browse components

Scalable and modular

Fronthack brings you a simple and fully hackable structure to avoid mess frequently associated with Bootstrap. It proposes a set of rules consisting of how to write and separate code, while giving you full control over the style properties and HTML markup. No !default variables and no overrides in Sass files.

Everything what you need

Combine together trending technologies and approaches. It does not matter if you are about to deliver web app, huge CMS implementation or small website. But what exactly is inside?

SMACSS and BEM

Separating files according to SMACSS methodology and using BEM naming convention makes your styles scalable and easy to maintain.

Web components library

Package of ready Sass components that are very basic and boilerplate. Do not reinvent the wheel.

Pure CSS

All typical jQuery use for basic interactions (except carousel) have been replaced with pure CSS techniques.

Written in Sass

Sass with a power of variables, mixins, nesting and clean syntax.

Flexbox grid

The most flexible Flexbox Grid system based on flex property.

Minimalistic form framework

Fully operational built in framework to style the forms. Contains validation states.

Gulp

An automation tool onboard to compile and preview your work in browser on file save.

Built in helpers

Helper classes and useful mixins to minimize the effort and keep the DRY rule.

OWL Carousel

Universal OWL Carousel 2 plugin implemented as one of the components.

CSS reset

Contains Normalize.css to set default appearance on all browsers.

Autoprefixer

Forget about writing vendor prefixes for CSS3 properties using Autoprefixer.

Mustache

A simple and old school templating engine to separate reusable elements like header and footer from the content specific for given page.

Getting started

1. Install the Fronthack Command Line Interface

npm install -g fronthack

2. Create a new Fronthack project in current path

fronthack init

3. Navigate to a newly created fronthack directory and check available commands

cd fronthack
fronthack help