/grabcss

A minimal, utility-first CSS framework for rapid UI development.

Primary LanguageSCSSMIT LicenseMIT

grabcss

A minimal, utility-first CSS framework for rapid UI development.

NPM Version Package License


Installation

npm i grabcss

How to use

Using built CSS

import "grabcss";

// Alternatively, you can import only the CSS file
// import "grabcss/grab.css";

Using SCSS

@use "grabcss/scss/mediaquery" as mediaquery;
@use "grabcss/scss/variables" as variables;
@use "grabcss/scss/utilities";

Using SCSS with customized variables

@use "grabcss/scss/mediaquery" as mediaquery;
@use "path/to/your-customized-variables" as variables;
@use "grabcss/scss/utilities";
// path/to/your-customized-variable.scss
@use "sass:map";
@use "grabcss/scss/variables" as variables with (
  // overrides
  $color-primary: #00a596
);

// additions
$color-light-border: #dce1e6;

$colors: map.merge(
  variables.$colors,
  (
    "light-border": $color-light-border,
  )
);

@forward "grabcss/scss/variables";