Skip to content

derinoh/sakura

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

45 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

sakura: a minimal classless css framework / theme.

[Go to Github repository]

The cherry blossoms

Just drop in sakura.css to any webpage and go from ugly looking 1900's website to a pretty modern website in literally 0 seconds.

Sakura supports extremely easy theming support using variables for duotone color scheming.

Comes with several existing themes, can be found in the css folder of this repository.

Demo

Compare a live page WITH and WITHOUT sakura.

Installation

  1. Download the file:

    wget "https://raw.githubusercontent.com/oxalorg/sakura/master/css/sakura.css"
    

    OR download directly: sakura.css

  2. Link it from html:

    <link rel="stylesheet" href="sakura.css">
    

(Optional) but recommended, use normalize.css to reset before using sakura.

Sites using Sakura

If you're using sakura, please let me know or make a pull request adding in your name. I would be super happy!! ^_^

Theming

You can make your own themes by overriding some variables for colors.

Here is an example file: ./scss/sakura-earthly.scss:

/* Duotone color scheming:
   Uses blossom as the revealing/stark color
   Uses fade as the more prominent color
*/
$color-blossom: #338618;
$color-fade: #5e5e5e;

/* bg color is used for the background of the page
   bg-alt is used for code-blocks etc
*/
$color-bg: #f9f9f9;
$color-bg-alt: #C7E3BE;

/* color of all the text on the page */
$color-text: #4a4a4a;
$font-size-base: 1.8rem;

@import "main";

Share some <3

Please leave a star :)

About

a minimal css framework/theme.

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Languages

  • CSS 98.1%
  • Makefile 1.9%