Heading | 3.0.x | NativeBase | Universal Components for React and React Native

Search
K
Hire us
If you are starting a new project, please try gluestack-ui for better performance and new design.
version: 3.0.x
Heading
Headings are used for rendering headlines. Heading composes  so you can use all the style props.
Import
Copy
import { Heading } from 'native-base';
Example
Basic
I'm a Heading
Playground
Sizes
(4xl) Heading
(3xl) Heading
(2xl) Heading
(xl) Heading
(lg) Heading
(md) Heading
(sm) Heading
(xs) Heading
Playground
Truncate
Basic text writing, including headings, body text, lists, and more.
Playground
Override
I'm overriding this heading
Playground
Composition
Mobile first accessible components for React Native & Web.
An accessible & utility-first component library to build your design system for all the platforms (web in beta).
Let's get started
Playground
Props
size
The size of the heading.
Type: number | "xs" | "sm" | "md" | "lg" | "xl" | "2xl"
Default: xl
Styling
NativeBase ships with a default theme for each component. Check out the default theme of the heading.
Info: We can easily extend the heading component theme using extendTheme function as described in the documentation .
Nativebase logo
MadeWithNativeBase
Gluestack logo
gluestack-ui