Getting Started

You can installGuvam 1Guvam 3using npm Already have a project? You can install Circuit UI via npm or yarn. In your current project directory, run the following command:

npm i @guvam/guvam

Import styles styles

import '@guvam/guvam/index.css';

Styling

Naming conventions & File organizing

block1__block2__block3__element—variable-name-value-name
Block1-Block2—Element-Variable
block__element—modifier
layout__column—open
block1/block2/block3.css
.Block3
  &.Block1-Block2-Block3__element—variable-name--value-Name

Layers

@layer base, theme, overwrite, inline;

  • Base - reset
  • Theme - in
  • Overwrite -
  • Inline -

Variables (Colors)

List of global variables ( + copy)

Size & space

Typography

Breakpoints & containers

Layout

Components

Blocks

Templates