Quick Start

Style-Forge package is a comprehensive CSS framework designed for modern web development. It provides a wide range of utilities and components to streamline the process of building responsive, aesthetically pleasing websites. With features like customizable themes, utility classes, and support for modern CSS technologies like flexbox and grid, style-forge aims to enhance productivity and maintainability in frontend development.

Installation

npm i style-forge

Usage

After installation, you can import the CSS file into your project or, if you are using Webpack or another module bundler:

@import 'style-forge';

Customization

Ideal for those who already have a project but need to exclude a specific module. Usually, this is the base module.

@import 'style-forge.base/src/all.css';  /* Base module */
@import 'style-forge.helpers/src/all.css';  /* Helpers module */
@import 'style-forge.form/src/all.css';  /* Form module */
@import 'style-forge.themes/src/all.css';  /* Themes module */
@import 'style-forge.patterns/src/all.css';  /* Patterns module */
@import 'style-forge.colors/src/web.css';  /* Colors module */
@import 'style-forge.media/src/all.css';  /* Media module */

You can also install any module individually for your project and customize it to match your styles:

Module	NPM	GitHub	Version	Description
Hub	npm	GitHub		Central repository that integrates all project modules.
Base	npm	GitHub		Basic styles and foundational components of the project.
Helpers	npm	GitHub		Utility functions and helpers for the project.
Form	npm	GitHub		Styles and components for creating forms.
Themes	npm	GitHub		Themes and styling options for the project.
Patterns	npm	GitHub		Reusable patterns and templates for the project.
Colors	npm	GitHub		Color palettes and styles for the project.
Media	npm	GitHub		Predefined CSS media query helpers for responsive design.