Version: 3.0.3

Heading

Headings are used for rendering headlines. Heading composes Text so you can use all the style props.

Import#

import { Heading } from 'native-base';

Example#

Basic#

Sizes#

Truncate#

Override#

Composition#

Props#

Name Type Description Default
size number | "xs" | "sm" | "md" | "lg" | "xl" | "2xl" The size of the heading. xl

Heading implements Text

Styling#

NativeBase ships with a default theme for each component. Checkout the default theme of formControl
We can easily extend the formControl component theme using extendTheme function as shown below.
import { extendTheme, NativeBaseProvider } from "native-base";
const theme = extendTheme({
components: {
FormControl: {
baseStyle: {},
defaultProps: {},
variants: {},
sizes: {},
}
}
});
function MyApp() {
return (
<NativeBaseProvider theme={theme}>
{/* Rest of the app goes here */}
</NativeBaseProvider>
)
}
Read more about extending component theme here.