A minimal and themeable css toolkit.
Siimple is an open source css toolkit that provides a responsive and minimalistic starting point for your next amazing website or application.
Fully customizable. Really.
Customize and extend siimple using your configuration from your project, including colors, fonts, sizes, shadows and more!
siimple.config.js
import colors from "@siimple/colors";
import base from "@siimple/preset-base";

export default {
    ...base,
    colors: {
        ...base.colors,
        primary: colors.royal["500"],
        secondary: colors.mint["500"],
        text: colors.royal["800"],
        background: colors.royal["100"],
        muted: colors.royal["200"],
    },
    fonts: {
        ...base.fonts,
        heading: ["Nunito", "sans-serif"],
        code: ["monospace"],
    },
    // ...other theme configuration
};

Hello!

Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.

Easy to learn. Simple to use.
Use our official presets for adding essential UI elements, helpers modifiers and icons for building your next amazing website.

Sign in

index.html
<div class="has-pl-4 has-pr-4 has-ml-auto has-mr-auto">
    <div class="card is-shadowed">
        <h3>Sign in</h3>
        <div class="has-mb-4">
            <label class="label">Your email</label>
            <input type="text" class="input" placeholder="you@email.com" />
        </div>
        <div class="has-mb-6">
            <label class="label">Your password</label>
            <input type="password" class="input" placeholder="Password" />
        </div>
        <button class="button is-full">
            <i class="si-lock has-pr-1"></i>
            <span>Sign in</span>
        </button>
    </div>
</div>

Features

Elements

We provide a collection of essential UI elements that you can customize and reuse across your projects

Helpers

A collection of utility CSS classes that can be used to change the style of any element.

Colors

A flat color palette that you can use for customizing your theme.

Icons

A collection of hand-crafted and pure CSS icons that can be used in web and mobile projects.

What people say about siimple?

Designmodo

This is a really cool framework for rapid prototyping or for building custom layouts without starting from scratch.

Colorlib

Siimple is a concise, flexible, beautiful, certainly minimal, front-end CSS framework that serves as the foundation for building FLAT and clean design web pages

TemplateToaster

Flexible, aesthetically built and a concise front-end CSS framework to accomplish clean web pages.

Designed and maintained with by @jmjuanes.

Code is licensed under MIT, documentation under Creative Commons Attribution 4.0.

Currently v4.3.0