siimple is published in npm, so you can add it to your project running the following command:

$ npm install siimple --save

Be sure that you have npm installed in your computer. Get more information about installing npm here.

Alternatively, you can install siimple using yarn instead of npm running the following command:

$ yarn add siimple --save

You can get more information about installing yarn here.

You can use the siimple CLI tool to generate your customized version of siimple. First just create your configuration file siimple.config.js in the root of your project:

import colors from "@siimple/colors";
import theme from "@siimple/preset-theme";
import elements from "@siimple/preset-elements";

export default {
    useRootStyles: false,
    useBorderBox: true,
    prefix: "",
    ...theme,
    colors: {
        primary: colors.blue["500"],
        secondary: colors.mint["600"],
        text: colors.gray["800"],
        background: "#fff",
        muted: colors.gray["200"],
    },
    fonts: {
        body: ["Roboto", "sans-serif"],
        heading: ["Montserrat", "sans-serif"],
        code: ["monospace"],
    },
    styles: {
        ...elements.styles,
    },
};

You can learn more about the configuration file for siimple in the configuration section.

After creating your configuration file, just run the siimple CLI tool to generate your CSS:

$ npx siimple -c ./siimple.config.js -o ./output.css

This will generate a file called output.css with the compiled styles of siimple.

You can use our hosted CSS version in JsDelivr and include siimple without installing any module. Note that:

• You can not customize the default theme.
• You can not customize the default modules (elements, helpers, ...).
• You can not provide your custom styles.
• You can not use third-party presets.

Check all available hosted versions in the jsDelivr website, or copy and paste the following <link> element in your HTML file for adding the latest version:

<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/siimple/siimple.css" />

You can also use unpkg for including the latest version in your HTML file:

<link rel="stylesheet" href="https://unpkg.com/siimple/siimple.css" />