A Collection Of CSS Styles To Make Your Site Nicer – furret.css

Category: CSS & CSS3 , Frameworks | June 29, 2022
Author:rayhanadev
Views Total:315 views
Official Page:Go to website
Last Update:June 29, 2022
License:MIT

Preview:

A Collection Of CSS Styles To Make Your Site Nicer – furret.css

Description:

The furret.css library provides a collection of preset CSS styles to make your websites prettier. Inspired by kognise’s Water.css library. No CSS classes and images required. Light and Dark modes are included.

How to use it:

1. Just add the following stylesheet to the webpage and the library will do the rest.

<!-- 🌙/☀ Automatic Theme: -->
<link rel="stylesheet" href="dist/library.min.css" />
<!-- 🌙 Dark Theme: -->
<link rel="stylesheet" href="dist/dark.min.css" />
<!-- ☀ Light Theme: -->
<link rel="stylesheet" href="dist/light.min.css" />

2. Override the default variables to create your own themes.

:root {
  --color-strong: #000000;
  --color-main: #434242;
  --color-dim: #737373;
  --accent-strong: #0676a2;
  --accent-main: #7ddaff;
  --accent-dim: #a8dff5;
  --highlight-color: rgba(125, 218, 255, 0.8);
  --selection-color: rgba(125, 218, 255, 0.2);
  --background-dark: #e3e3e3;
  --background-darker: #f3f3f3;
  --background-darkest: #ffffff;
}
@media (prefers-color-scheme: dark) {
:root {
  --color-strong: #ebebeb;
  --color-main: #e3dede;
  --color-dim: #a2a2a2;
  --accent-strong: #0676a2;
  --accent-main: #0f9ad2;
  --accent-dim: #a8dff5;
  --highlight-color: rgba(15, 154, 210, 0.8);
  --selection-color: rgba(15, 154, 210, 0.2);
  --background-dark: #212121;
  --background-darker: #121212;
  --background-darkest: #050505;
}

More Previews:

furret.css Input Fields furret.css Inline Elements furret.css Blockquotes furret.css Headings

You Might Be Interested In:


Leave a Reply