Value header · Components

The native kit's real component, live in its web build at phone width. Follows this site's theme.

Usage

The hero figure at the top of a screen. maskable adds the eye toggle for anything someone might not want visible over their shoulder.

<ValueHeader value label? caption? captionTone? maskable? align? />

Already in every copy of the native kit:

import { ValueHeader } from '@/components/kit/value-header';

Exports: ValueHeader
Source: apps/mobile/components/kit/value-header.tsx
Packages: lucide-react-native@^1.21.0
Installs with: @kit-native/icon, @kit-native/lib-haptics, @kit-native/lib-utils, @kit-native/text
Also searched as: balance, hero number, total, amount, mask, hide balance
Registry JSON: /r/native/value-header.json

The web kit's real component, live. Follows this site's theme.

The hero figure at the top of a page. maskable adds the eye toggle for anything someone might not want visible over their shoulder.

<ValueHeader value label? caption? captionTone? maskable? align? />

Already in every copy of the web kit:

import { ValueHeader } from '@/components/kit/value-header';

Agents: the whole registry is at /llms.txt.