# @atomixdesign/rem-scaling

> > TODO: description

Latest version **2.1.1** (published 2022-01-25) · MIT license · 0 weekly downloads

## Install

```sh
npm install @atomixdesign/rem-scaling
pnpm add @atomixdesign/rem-scaling
yarn add @atomixdesign/rem-scaling
bun add @atomixdesign/rem-scaling
```

## Health

**Score 30/100 (F)** — status: abandoned.

Positive: has types; esm support; no vulnerabilities; high quality score.

Warnings: low downloads.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 2.1.1 |
| Published | 2022-01-25 |
| First published | 2021-08-09 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | bundled |
| Module format | ESM + CommonJS |
| Dependencies | 0 |
| Unpacked size | 47.2 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| GitHub stars | 1 |
| Author | Jack Hillman |
| Maintainers | jackatomix, samielk20 |

## Links

- npm: https://www.npmjs.com/package/@atomixdesign/rem-scaling
- Repository: https://github.com/atomixdesign/rem-scaling
- Homepage: https://github.com/atomixdesign/rem-scaling#readme
- Issues: https://github.com/atomixdesign/rem-scaling/issues
- npm.io page: https://npm.io/package/@atomixdesign/rem-scaling

## Recent versions

- 2.1.1 (latest) — 2022-01-25
- 2.1.0 — 2021-09-13
- 2.0.3 — 2021-09-13
- 2.0.2 — 2021-09-13
- 2.0.1 — 2021-09-13
- 2.0.0 — 2021-09-13
- 1.1.6 — 2021-09-10
- 1.1.5 — 2021-08-09
- 1.1.4 — 2021-08-09
- 1.1.3 — 2021-08-09
- 1.1.2 — 2021-08-09
- 1.1.1 — 2021-08-09
- 1.1.0 — 2021-08-09
- 1.0.7 — 2021-08-09
- 1.0.6 — 2021-08-09
- … 6 more at https://npm.io/package/@atomixdesign/rem-scaling/versions

## README

## Usage

Attach the rem font scaling

```tsx
import { HtmlFontSetter } from '@atomixdesign/rem-scaling'


new HtmlFontSetter({
  min: 12, // Min px size
  max: 16, // Max px size
  base: 16, // Default px size (normally this is the max size). Used for when no breakpoints match
  breakpoints: {
    md: [768, 1024], // Font-size @768: 12px, @1024: 16px
    lg: [1024, 1600],
  },
  fallback: [Number.NEGATIVE_INFINITY, Number.POSITIVE_INFINITY], // Fallback breakpoint for SSR, if no SSR is needed just use this
})
```

If you'd like to remove the rem scaling in the future, simply call the return value

```tsx
import { HtmlFontSetter } from '@atomixdesign/rem-scaling'

const instance = new HtmlFontSetter({ ... })

instance.destroy()
```

---
_Source: https://npm.io/package/@atomixdesign/rem-scaling · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._