Skip to content

hardikforall/MinimaCSS

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

26 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

MinimaCSS Logo

MinimaCSS ✨

MinimaCSS is an elegantly designed and versatile CSS framework, perfect for crafting beautiful websites. Launched in 2017 and refined in 2018 for a variety of web projects, MinimaCSS encapsulates the vision of providing an accessible yet sophisticated tool for web design. It's an ideal solution for newcomers seeking beauty in simplicity and professionals demanding aesthetic finesse in their projects.

This framework celebrates the beauty of design, offering a harmonious balance between ease of use and the ability to create stunning visual experiences.

Why MinimaCSS? 🤔

In an era where front-end frameworks can be cumbersome and complex, MinimaCSS emerges as a beacon of aesthetic clarity. It revives the essence of CSS design, blending simplicity with the capability to create visually appealing interfaces.

Features 🚀

  • Extensive Components: Extensive selection of pre-built components, ready for integration into diverse web projects.
  • Design Flexibility: Each element is meticulously crafted for visual excellence, supporting a wide range of aesthetic preferences.
  • Utility Classes: Comprehensive and intuitive utility classes for rapid, flexible design adjustments.
  • Responsive Design: Built for seamless responsiveness, ensuring compatibility across all devices.
  • Utilities: Handy utility classes for spacing, visibility, backgrounds, text colors, and more.
  • Light and Dark Mode : Light and Dark mode Included by default. Default dark mode for modern aesthetics.
  • Comprehensive Documentation : Detailed documentation and support for a smooth development experience.

Installation 💾

To get started with MinimaCSS, you have two options: download the compiled CSS directly or download the project, customise it and build your own css.

CDN Include

You can directly use latest minimacss from CDN use the below link in your html

<link
  rel="stylesheet"
  href="https://cdn.jsdelivr.net/gh/hardikforall/MinimaCSS/dist/minimacss.css"
/>

or you can use Minified css

<link
  rel="stylesheet"
  href="https://cdn.jsdelivr.net/gh/hardikforall/MinimaCSS/dist/minimacss.min.css"
/>

Direct Download 📦

Download the minimacss.css file from the /dist folder and include it in your project:

<link rel="stylesheet" href="path-to-minimacss/minimacss.css" />

Customization and Building 🛠️

MinimaCSS is designed to be easily customizable. To create a version tailored to your needs, follow these steps:

  1. Clone the repository:
git clone https://github.com/hardikforall/MinimaCSS.git
  1. Navigate to the project directory

  2. Install the required dependencies:

npm install
  1. Make your customizations: Edit the SCSS files in the /src directory to suit your project's needs. You can modify variables, adjust styles, or even add new components.

  2. Build your custom CSS: Once you've made your changes, you can build your custom version of MinimaCSS by running:

npm run build

This command compiles your SCSS files and outputs a minified CSS file in the /dist directory. And you're done! You now have a version of MinimaCSS that's tailored specifically to your project's requirements.

Documentation 📘

Get Started: Quick and easy guides to get you up and running. Advanced Usage: In-depth tutorials for advanced features and customization. Latest Updates: Stay updated with new features and improvements.

Explore Documentation

Todo

  • Create Documentation

Contributions

Contributions are welcome! If you'd like to improve MinimaCSS, feel free to fork the repository, make your changes, and submit a pull request.