--- title: SSF Number Formatter hide_table_of_contents: true ---
As explained in ["Number Formats"](/docs/csf/features/nf), modern spreadsheet file formats separate "content" from "presentation". Instead of storing a formatted value like `$3.50`, applications will store the underlying value (`3.50`) and the number format (`$0.00`). Parsers are expected to render values. The SheetJS `SSF` ("SpreadSheet Format") library formats numbers according to the number formatting rules defined in Excel and other spreadsheet software[^1] A version of the library ships with the main file processing library. It is deeply integrated in SheetJS CE API functions including `read`[^2], `write`[^3], and `sheet_to_json`[^4]. The library is also available for standalone use on the SheetJS CDN[^5]. Source code and project documentation are hosted on the SheetJS git server at https://git.sheetjs.com/sheetjs/sheetjs/src/branch/master/packages/ssf ## Live Demo The formatted text is calculated from the specified number format and value. Please [report an issue](https://git.sheetjs.com/sheetjs/sheetjs/issues) if a particular format is not supported. ```jsx live function SheetJSSSF() { const [fmt, setFmt] = React.useState("#,##0"); const [val, setVal] = React.useState(7262); const [text, setText] = React.useState(""); React.useEffect(() => { if(typeof SSF == "undefined") return setText("ERROR: Reload this page!"); let v = +val; if(!isFinite(v)) return setText(`ERROR: ${val} is not a valid number!`); try { setText(SSF.format(fmt, v)); } catch(e) { setText("ERROR: " + (e && e.message || e)); } }, [fmt, val]); const goodstyle = { backgroundColor: "#C6EFCE", color: "#006100" }; const badstyle = { backgroundColor: "#FFC7CE", color: "#9C0006" }; return (Number Format | setFmt(e.target.value)}/> |
Number Value | setVal(e.target.value)}/> |
Formatted Text |
{text}
|