Format Byte

A utility component for displaying file sizes in a human-readable format. Automatically converts bytes to appropriate units (KB, MB, GB, TB) and supports multiple display formats and locales.

Anatomy

<script>
  import { FormatByte } from "@saas-ui/svelte/utilities/format-byte";
</script>

<!-- Basic usage -->
<FormatByte value={1024} />

<!-- With unit type -->
<FormatByte value={1024} unit="bit" />

<!-- With custom locale -->
<FormatByte value={1024} locale="de-DE" />

<!-- With unit display format -->
<FormatByte value={1024} unitDisplay="long" />

Examples

Basic Accessibility

Basic usage showing automatic byte size formatting with default options.

Format Bits Accessibility

Use the unit prop set to bit to display values in bit units (bit, kbit, Mbit, Gbit, Tbit).

Locale Accessibility

Use the locale prop to format numbers according to different regional conventions.

Sizes Accessibility

Demonstrates automatic unit scaling from bytes to kilobytes, megabytes, gigabytes, and terabytes.

Unit Display Accessibility

Use the unitDisplay prop to control unit format: short (kB), narrow (kB without space), or long (kilobytes).

Props

Prop Type Default Description
value number - The byte size to format.
unit byte | bit byte The unit granularity to display.
unitDisplay long | short | narrow short The unit display format.
locale text - The locale to use for formatting. If not provided, uses the locale from LocaleProvider context.