Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 6 additions & 0 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
@@ -1,5 +1,11 @@
# baseline-kit

## 3.0.2

### Patch Changes

- More Readme fix

## 3.0.1

### Patch Changes
Expand Down
46 changes: 30 additions & 16 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,26 +4,40 @@
![npm version](https://img.shields.io/npm/v/baseline-kit)
![License](https://img.shields.io/github/license/dnvt/baseline-kit)

Baseline Kit is a lightweight development tool for visualizing and debugging grid systems and spacing in React 19 applications. It provides configurable overlays for both column-based and baseline grids, flexible layout components, and theme-aware configuration—all optimized for performance and built with TypeScript.
Baseline Kit is a lightweight development tool for visualizing and debugging grid systems and spacing in React applications. It provides configurable overlays for both column-based and baseline grids, flexible layout components, and theme-aware configuration—all optimized for performance and built with TypeScript. The library is based on the "Padded Grid" concept, originally explored in [this article](http://medium.com/design-bootcamp/the-padded-grid-a-designers-hack-to-achieve-baseline-fit-fc40d022bc84) on achieving perfect baseline alignment in digital layouts.

![Demo visual](kit.png)

## Table of Contents
- [Base Unit](#base-unit)
- [Spacing Values](#spacing-values)
- [Grid Snapping](#grid-snapping)
- [Debugging Modes](#debugging-modes)
- [Component Hierarchy](#component-hierarchy)
- [Key Components](#key-components)
- [Config](#config)
- [Baseline](#baseline)
- [Guide](#guide)
- [Box](#box)
- [CSS Import Options](#css-import-options)
- [Theme Options](#theme-options)
- [Theme Variables Reference](#theme-variables-reference)
- [SSR-Friendly Design](#ssr-friendly-design)
- [SSR Mode Prop](#ssr-mode-prop)
- [Features](#features)
- [Requirements](#requirements)
- [Installation](#installation)
- [Quick Start](#quick-start)
- [Core Concepts](#core-concepts)
- [Base Unit](#base-unit)
- [Spacing Values](#spacing-values)
- [Grid Snapping](#grid-snapping)
- [Debugging Modes](#debugging-modes)
- [Components](#components)
- [Component Hierarchy](#component-hierarchy)
- [Key Components](#key-components)
- [Config](#config)
- [Baseline](#baseline)
- [Guide](#guide)
- [Box](#box)
- [Theme System](#theme-system)
- [CSS Import Options](#css-import-options)
- [Theme Options](#theme-options)
- [Theme Variables Reference](#theme-variables-reference)
- [Browser Support](#browser-support)
- [React 19 Features](#react-19-features)
- [Server-Side Rendering (SSR)](#server-side-rendering-ssr)
- [SSR-Friendly Design](#ssr-friendly-design)
- [SSR Mode Prop](#ssr-mode-prop)
- [Development](#development)
- [Performance Features](#performance-features)
- [Contributing](#contributing)
- [License](#license)

## Features

Expand Down
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -75,7 +75,7 @@
"vitest": "3.0.8"
},
"name": "baseline-kit",
"version": "3.0.1",
"version": "3.0.2",
"type": "module",
"homepage": "https://github.com/dnvt/baseline-kit#readme",
"types": "dist/index.d.ts",
Expand Down