femtocss

Femto.css, a simple CSS framework

No crap, just simple HTML

Femto.css aims to be a very simple CSS framework that lets you generate modern webpages without abusing the

tag, inline classes or having to spend valuable time learning a stilted CSS framework. Femto.css is mainly intended to be used for projects that need a website, small businesses and personal websites, but you can use it for anything!

Download / Getting Started

Using npm

1) Run npm i -D git+https://notabug.org/nokoru/femtocss

Without npm

1) Clone the repository git clone https://notabug.org/nokoru/femtocss.git

2) Select/open the src/ directory.

3) Copy the following files to your website directory: femto.css, femto.js, Inter/ and either light-theme.css or dark-theme.css depending on which theme you prefer. You can optionally just copy the Inter/ directory and any minified version of the framework (*.min.css) (you should do this only if you want to use a theme without copying two files).

3) Configure the femto.css file: there's a line that imports the light theme by default, you may change this if you're using other theme.

4) Add the <meta viewport> tag, the femto.css stylesheet and femto.js script to your HTML files:

<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="path/to/femto.css" />
<script type="text/javascript" src="path/to/femto.js"></script>

5) Done! I recommend you to read this quick tutorial before using the framework, it's really easy to understand how to make a website using femtocss, but it's kinda different to other frameworks (which makes it simpler!).

How to use it

Please read the wiki/documentation. I wrote a short tutorial about how to use femto.css

Here's a demo page made using femto.css

Why Femto.css exists

Because modern web development is full of annoying stuff and unnecessarily complex things like bloated JS front-ends, pretty stilted CSS frameworks and forced CDNs, so this is my contribution to build a modern, but clean and easy-to-develop internet.

femto.css lets you generate modern websites without spending precious time trying to learn Bootstrap / Materialize / [insert a popular framework here]'s nested classes.

To use femto.css you only need to know basic HTML5 tags and basic CSS.

My main motivation to create Femto.css is that I'll probably need a modern CSS framework for my future projects' websites, and I want to keep those sites really simple for small projects.

Warning

This software is still in Alpha phase, so it may lack features. You are invited to contribute implementing new features if you want!

Contributing

If you want to contribute send a pull request and I'll review it. If you are not experienced using git or web technologies just open an issue if you want to report a bug or propose a new feature or change.

Credits

Written by nokoru <nokoru@disroot.org>

Inter font family by Rasmus Andersson, licensed under the SIL Open Font License Version 1.1 (see Inter/license.txt for details)

Femto.css is licensed under the Unlicense (it's public domain software, do what you want with it!)

The header background image is CC0. I don't know the license of the notabug.org logo, but it's a free cultural work I guess... (I'm using it only to link a webpage to this repository). Anyway, for that image, all credit to the notabug.org Staff.

Contact

I use XMPP fairly often, so it's a great idea to use it for chatting with me, or you can use Matrix if you don't like XMPP.

XMPP: nokoru@disroot.org

Matrix: @nokoru:matrix.linux.pizza (I recommend you to use the Riot client)

Neocities: nokoru.neocities.org (just post a message)