Carb Sweet LogoCarb Go to Github ⟶

Welcome to Carb, a super-sweet way of writing your website styling.

Never coded a website before but love to design? Or are you a backend developer who has never dabbled in frontend code?

No matter who you are, Carb simplifies the way you style your website by providing a simple syntax to define properties for different HTML elements.

Carb energizes your workflow

After 5 years of website development, I was very keen to build a new simple syntax for the language I use so often.

The best way to explain Carb is by showing you some code:

CSS Styling

p {
 font-size: 12px;
 box-shadow: 0px 0px 10px #000;
}

h1, h2, h3 {
 font-weight: 900;
}

@media(max-width: 600px) {
  h1 {
    font-size: 1.5rem;
    font-weight: 700;
  }
}
styling.css

Carb Sweet Logo Styling

p:
 font-size 12px
 box-shadow 0px 0px 10px #000

h1 = h2 = h3:
 font-weight 900

@responsive max-width 600px:
  h1:
    font-size 1.5rem
    font-weight 700
styling.carb

Save on wasted lines, reduce awkward miss-types trying to find hard-to-reach characters "{;}" and overall present your code in a better form-factor that is easier to understand.

This project was inspired by my use of Elm and Elixir in a majority of recent web projects, both of which have ditched the "{;}" syntax - so I thought it was about time to bring CSS up to scratch.

Check out Carb on GitHub

Carb is fully open-source and available from Github.
Be sure to shoot me a DM on Twitter if you require any assistance! (@Ps300300)
For now, enjoy your Carbs people!