All Projects → jmjuanes → siimple

jmjuanes / siimple

Licence: MIT license
The minimal and themeable CSS toolkit for flat and clean designs

Programming Languages

javascript
184084 projects - #8 most used programming language

Projects that are alternatives of or similar to siimple

Siimple
The minimal CSS toolkit for flat and clean designs
Stars: ✭ 502 (-4.38%)
Mutual labels:  minimal, css-framework, flat
redmine-theme-minimalflat
Minimal and flat design Redmine theme.
Stars: ✭ 12 (-97.71%)
Mutual labels:  minimal, flat
Stitches
CSS-in-JS with near-zero runtime, SSR, multi-variant support, and a best-in-class developer experience.
Stars: ✭ 4,402 (+738.48%)
Mutual labels:  css-framework, css-in-js
Water.css
A drop-in collection of CSS styles to make simple websites just a little nicer
Stars: ✭ 6,666 (+1169.71%)
Mutual labels:  minimal, css-framework
Beamwind
a collection of packages to compile Tailwind CSS like shorthand syntax into CSS at runtime
Stars: ✭ 32 (-93.9%)
Mutual labels:  css-framework, css-in-js
Lit
World's smallest responsive 🔥 css framework (395 bytes)
Stars: ✭ 1,866 (+255.43%)
Mutual labels:  css-framework, flat
notion.css
A minimal CSS framework that resembles the aesthetic of the note taking app Notion
Stars: ✭ 28 (-94.67%)
Mutual labels:  minimal, css-framework
Legacycss
Legacy CSS - Modern and Lightweight CSS Framework
Stars: ✭ 48 (-90.86%)
Mutual labels:  css-framework, flat
Dropin Minimal Css
Drop-in switcher for previewing minimal CSS frameworks
Stars: ✭ 1,061 (+102.1%)
Mutual labels:  minimal, css-framework
Pico
Graceful & Minimal CSS design system in pure semantic HTML
Stars: ✭ 89 (-83.05%)
Mutual labels:  minimal, css-framework
Snack
🍱 A minimal CSS framework for web.
Stars: ✭ 117 (-77.71%)
Mutual labels:  minimal, css-framework
colors
🎨 An elegant and minimalistic color palette for UI design.
Stars: ✭ 19 (-96.38%)
Mutual labels:  css-framework, siimple
Lemon
🍋 Minimal and responsive CSS framework for fast building websites.
Stars: ✭ 51 (-90.29%)
Mutual labels:  minimal, css-framework
Redmine Theme Minimalflat2
Minimal and flat theme for Redmine.
Stars: ✭ 128 (-75.62%)
Mutual labels:  minimal, flat
koochak
A minimal & lightweight CSS framework
Stars: ✭ 15 (-97.14%)
Mutual labels:  minimal, css-framework
strawberry
A new flexbox based CSS micro-framework.
Stars: ✭ 71 (-86.48%)
Mutual labels:  css-framework
hucssley
Hucssley - a full-featured, consistent, atomic utility class library for rapidly building performant UI
Stars: ✭ 79 (-84.95%)
Mutual labels:  css-framework
Hypermarket
If you are looking for a stylish and elegant website template for your online store, Hypermarket is the perfect choice for you.
Stars: ✭ 49 (-90.67%)
Mutual labels:  minimal
steller-css
⛰️ A utility-first CSS framework that serves as the foundation of your design system
Stars: ✭ 14 (-97.33%)
Mutual labels:  css-framework
system-ui.com
Standards for creating consistent, interoperable user interfaces
Stars: ✭ 64 (-87.81%)
Mutual labels:  css-in-js

Siimple header

NPM Version Follow @siimplecss Get help MIT License PRs welcome CI

Welcome to the siimple CSS toolkit repository 🎉

What is siimple

We call siimple a CSS toolkit because it is a themeable and customizable CSS framework, but also a CSS engine that you can use for building your own CSS framework.

Inspired by other CSS frameworks (like bulma), but:

  • Fully themeable: use your own theme to customize and extend siimple.
  • Use what you really need: include the core modules (elements, helpers, ...) and themes that you REALLY need for your project.
  • No dependencies: written all from scratch without any dependencies.
  • No CSS preprocessors needed: we provide a tiny CLI to compile the CSS, so you do not need any other preprocessor like SASS or LESS.
  • Color palette included: we provide a flat color palette to customize siimple with different colors.
  • Pure CSS icons included: we provide a collection of pure CSS icons.

Packages

Along with siimple and siimple-icons packages, the packages listed in the table below are also available on this repository. These packages are published in the @siimple organization in npm.

Package Description Included in siimple
@siimple/core Core engine of the siimple CSS toolkit. ✔️
@siimple/modules Core modules of siimple. ✔️
@siimple/colors Color palette for siimple. ✔️
@siimple/preset-base Base theme of siimple. ✔️

The version of these packages are different from the main siimple and siimple-icons packages, but follows this convention: the version 4.x.y of siimple equals to version 0.x.y of all packages published in the @siimple organization.

Development

Here are the instructions for building siimple from the source code. Before you get started, ensure you have Node 14 and Yarn installed in your computer.

First clone this repository in your local machine running the following command:

$ git clone https://github.com/jmjuanes/siimple

Navigate into the repository folder and then install dependencies with yarn:

$ yarn install

Build siimple and siimple-icons

Run the following command to build the siimple CSS framework in siimple/siimple.css and the siimple-icons CSS in siimple-icons/siimple-icons.css:

$ yarn run build

Documentation

We are using Gatsby for documentation. After building the CSS of the siimple framework you can build the documentation site with the following command:

$ yarn run build:website

Start the website server with the following command:

$ yarn run serve:website

License

Code and documentation of siimple © 2015-present Josemi Juanes. Code released under the MIT license. Documentation released under Creative Commons Attribution 4.0.

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].