ReoGrid ReoGrid Web

Number Formatting

ReoGrid Web supports Excel-compatible number format codes. A format code controls how a cell’s raw value is displayed without changing the stored value.

Live Demo

Applying a format

Use setFormat() on a cell or range, or assign to the format property directly.

// Single cell
worksheet.cell('B2').setValue('4999').setFormat('$#,##0.00')

// Range
worksheet.range('B2:B10').setFormat(NumberFormat.currency('$', 2))

// Property assignment
worksheet.cell('C3').format = '0.00%'

// Clear format
worksheet.cell('B2').format = undefined

NumberFormat helpers

The NumberFormat utility generates format codes for common cases. Import it alongside createReogrid:

import { createReogrid, NumberFormat } from '@reogrid/lite'

NumberFormat.number(decimals?, grouping?)

NumberFormat.number()          // '#,##0'       → 1,234,567
NumberFormat.number(2)         // '#,##0.00'    → 1,234,567.89
NumberFormat.number(2, false)  // '0.00'        → 1234567.89
ParamTypeDefaultDescription
decimalsnumber0Number of decimal places
groupingbooleantrueAdd thousands separator

NumberFormat.percent(decimals?)

NumberFormat.percent()   // '0%'     → 43%
NumberFormat.percent(2)  // '0.00%'  → 42.75%

The raw cell value should be a decimal fraction (e.g. '0.4275' displays as 42.75%).

NumberFormat.currency(symbol, decimals?, position?)

NumberFormat.currency('$', 2)            // '$#,##0.00'  → $4,999.00
NumberFormat.currency('€', 2)            // '€#,##0.00'  → €4,999.00
NumberFormat.currency('¥', 0)            // '¥#,##0'     → ¥4,999
NumberFormat.currency('円', 0, 'suffix') // '#,##0円'    → 4,999円
ParamTypeDefaultDescription
symbolstringCurrency symbol
decimalsnumber0Decimal places
position'prefix' | 'suffix''prefix'Symbol placement

NumberFormat.date(pattern?)

NumberFormat.date()               // 'yyyy-mm-dd'   → 2025-03-17
NumberFormat.date('MM/dd/yyyy')   // 'MM/dd/yyyy'   → 03/17/2025
NumberFormat.date('d MMM yyyy')   // 'd MMM yyyy'   → 17 Mar 2025

The raw value must be an Excel serial date (number of days since 1900-01-01). When loading xlsx files, date cells already carry serial values and format codes — no extra work needed.

NumberFormat.time(pattern?)

NumberFormat.time()               // 'HH:mm:ss'     → 18:00:00
NumberFormat.time('h:mm AM/PM')   // 'h:mm AM/PM'   → 6:00 PM

The raw value must be a decimal fraction of a day (e.g. '0.75' = 18:00).


Using raw format codes

You can also pass any Excel-compatible format code string directly:

worksheet.cell('A1').setFormat('#,##0.0')       // one decimal, grouped
worksheet.cell('A2').setFormat('0.000%')         // percent, 3 decimals
worksheet.cell('A3').setFormat('"€"#,##0.00')   // quoted symbol
worksheet.cell('A4').setFormat('[Red]0.00')      // color modifier

Format codes reference

Pattern tokenMeaning
0Digit, show zero if absent
#Digit, suppress trailing/leading zero
,Thousands separator (when between #/0)
.Decimal point
%Multiply by 100 and append %
"text"Literal text
d / ddDay (1–31 / 01–31)
m / mm / mmm / mmmmMonth (numeric / 2-digit / abbrev / full)
yy / yyyyYear (2-digit / 4-digit)
h / hhHour (12h / 24h with leading zero)
mm (after h)Minutes
ssSeconds
AM/PM12-hour clock indicator