Skip to content

CSS UI and utility framework to build modern and responsive components

License

Notifications You must be signed in to change notification settings

Fernosa/FernosaCSS

Repository files navigation

Gray shape shifter

Fernosa

Flexible CSS Framework Packed With Responsive Components And Utility

Join Our Discord For Help: https://discord.gg/9VgwJetEvG

Documentation: Soon (Currently Available On Discord)

Note: This library is still under development so most of features might not work yet



👀 Why Fernosa?

  • Fernosa is an open-source CSS library under development.
  • It is customizable to the brink, allowing you to change the colours according to your colour palette, and based on that, the components will be generated.
  • You can also make the most of the utility classes we provide to change the components to what you find suitable.
  • It comes packed with beautiful and completely responsive components that can be used in your commercial and personal projects.
  • Fernosa also gives you the freedom to use a lot of CSS effects that we provide, like neon, hover effects, etc.
  • If you want to speed up your work without wasting hours customising components, Fernosa is for you.

🤔 How TO Use It?

You can use Fernosa by linking the following stylesheet in your html <head> tag.

<link
  rel="stylesheet"
  href="https://cdn.jsdelivr.net/gh/Fernosa/FernosaCSS@main/FernosaCSS/fernosa.css"
/>

Join our discord if you encounter any issues. our team will gladly assist you.

🙄 How to customize colors?

  1. Download the Visual studio code extension: Live Sass Compiler

  2. Download the SCSS file: Here

  3. In the scss file, simply edit the theme colors variables to suit your color theme




# Example:
Try adding color gold and set it's color value to #FFD700



Once you setup the color palette, click on watch sass which appears on the bottom.



Final step Link the compiled css the sass compiler generates, to the html!
<link rel="stylesheet" href="https://pro.fontawesome.com/releases/v5.10.0/css/all.css" integrity="sha384-AYmEC3Yw5cVb3ZcuHtOA93w35dYTsvhLPVnYs9eStHfGJvOvKxVfELGroGkvsg+p" crossorigin="anonymous"/>

Link this fontawesome CDN inside the head


Also link the javascript CDN

    <script src="https://cdn.jsdelivr.net/gh/Fernosa/FernosaCSS@main/scripts/fernosa.js"></script>

That's it!
Wollah! It will start working, Happy Hacking!