Typographystable

Kern

Glyphs that open up, lift and gain weight as the pointer passes them.

TYPESET

Customize

Opticalper-glyph response to pointer distance

Texttext

Size88 pxsize

Radius160 pxradius

Spread0.340spread

Lift12 pxlift

Weight axis320weight

Ease0.180ease

TSX

import { Kern } from "zerogravity"

<Kern />

Generated from the controls above. Only props that differ from their defaults are shown.

7 documented props on Kern
Property	Type	Default	Description
`text`	`string`	`"TYPESET"`	Text.
`size`	`number`	`88`	Size. Range 32 to 180 px.
`radius`	`number`	`160`	Radius. Range 40 to 500 px.
`spread`	`number`	`0.34`	Spread. Range 0 to 1.
`lift`	`number`	`12`	Lift. Range 0 to 60 px.
`weight`	`number`	`320`	Weight axis. Range 0 to 500.
`ease`	`number`	`0.18`	Ease. Range 0.02 to 1.

0 external runtime dependencies

Ships with nothing but React.