Format Number

Used to format numbers to a specific locale and options

Usage

The number formatting logic is handled by the native Intl.NumberFormat API and smartly cached to avoid performance issues when using the same locale and options.

import { Format } from '@ark-ui/react'

Examples

Basic

Use the Format.Number component to format a number with default options.

Example not found

Example not found

Example not found

Example not found

Percentage

Use the style="percent" prop to format the number as a percentage.

Example not found

Example not found

Example not found

Example not found

Currency

Use the style="currency" prop along with the currency prop to format the number as a currency.

Example not found

Example not found

Example not found

Example not found

Locale

Use the locale prop to format the number according to a specific locale.

Example not found

Example not found

Example not found

Example not found

Unit

Use the style="unit" prop along with the unit prop to format the number with a specific unit.

Example not found

Example not found

Example not found

Example not found

Compact Notation

Use the notation="compact" prop to format the number in compact notation.

Example not found

Example not found

Example not found

Example not found