Skip to content
A Lightweight, Responsive and Modern CSS Framework
Branch: master
Clone or download
Latest commit cd9b1a9 May 25, 2019
Type Name Latest commit message Commit time
Failed to load latest commit information.
.github updated May 24, 2019
dist Minor Modal bug Fixed May 19, 2019
src Update - vertical-align: middle May 13, 2019 Initial Contribution Details Oct 25, 2018
LICENSE Initial commit Oct 6, 2018 Updated May 19, 2019
index.html Script file link changed May 2, 2019
package.json added npm May 3, 2019
prepros-6.config Minor Modal bug Fixed May 19, 2019

Butter Cake logo

Butter Cake

A Modern Lightweight Front End CSS framework for faster and easier web development.
Explore Butter Cake docs »

Report bug . Request feature . Examples

Butter Cake logo

Status Butter Cake logo

Awesome Css

GitHub Releases Website GitHub issues

Butter Cake logo

Build responsive, mobile-first projects on the web with Butter Cake.

Butter Cake is an open source and lightweight modular toolkit for developing with HTML, CSS, and JS. Quickly prototype your ideas or build your entire app with our Sass(SCSS) variables and mixins, responsive grid system, extensive prebuilt components.

Butter Cake logo

Butter Cake is constantly in development! Try it out now.

Butter Cake logo

Documentation Butter Cake logo

Checkout the official website for the Documentation.

Why You should use - Butter Cake Butter Cake logo

  • ✈️ light weight 59kb (css) & 4kb (js)
  • 🗃 Modular Components
  • 🏠 Simple Structure
  • 📜 Built Using Sass(SCSS)
  • 📲 Responsive

No need to setup development environment with Gulp etc... because Butter Cake uses Prepros (FREE APP) to compile SASS(SCSS).

Can start a new project within seconds 😻!!

What's included Butter Cake logo

Butter Cake/
├── dist/
│    │
│    ├── css/
│    │   ├── butterCake.min.css (59kb)
│    │   └── (33kb)
│    │ 
│    └── js/
│        ├── butterCake.js (Non Minified) (9kb) - (Complete components Js)
│        ├── butterCake.min.js (Minified) (4kb) - (Complete components Js)
│        ├── alert.js 
│        ├── accordion.js 
│        ├── dropdown.js 
│        ├── modal.js 
│        ├── tabs.js 
│        ├── side-navbar.js (Side Navbar)
│        └── slideDown-navbar.js (Slide Down Navbar)
├── src/ (Includes SASS|SCSS Files)
├── prepros-6.config
└── index.html (Starter File)

What's new in v2.5.0 Butter Cake logo

What's improved in v2.5.0 Butter Cake logo

Get Started Butter Cake logo


npm i buttercake

CSS (jsdelivr)

<link rel="stylesheet" href="">

JS (jsdelivr)

<script src=""></script>

Browser Support Butter Cake logo

Butter Cake uses autoprefixer to make (most) Flexbox features compatible with earlier browser versions. According to Can I use, Butter Cake is compatible with recent versions of:

  • Chrome
  • Firefox
  • Edge
  • Safari
  • Opera

Internet Explorer (10+) is only partially supported.

Support the developement Butter Cake logo

Copyright and license Butter Cake logo

Code copyright 2018 - 2019 Himas Rafeek. Code released under the MIT license.

You can’t perform that action at this time.