Skip to main content
Version: 3.4.2

Pricing

Pricing is a convenience component used to display features and pricing tables in a beautiful and engaging way.

Pricing Component

Usage​

import { PricingCard } from 'react-native-elements';

<PricingCard
color="#4f9deb"
title="Free"
price="$0"
info={['1 User', 'Basic Support', 'All Core Features']}
button={{ title: 'GET STARTED', icon: 'flight-takeoff' }}
/>;

Props​


Reference​

button​

button information (required)

TypeDefault
{...Button props}
OR
component
none

color​

color scheme for button & title

TypeDefault
stringnone

containerStyle​

outer component styling (optional)

TypeDefault
object (style)inherited styling

info​

pricing information (optional)

TypeDefault
array of stringsnone

infoStyle​

specify pricing information style

TypeDefault
style (object)none

onButtonPress​

function to be run when button is pressed

TypeDefault
anynone

price​

price (required)

TypeDefault
stringnone

pricingStyle​

specify pricing text style

TypeDefault
style (object)none

title​

title (required)

TypeDefault
stringnone

titleStyle​

specify title text style

TypeDefault
style (object)none

wrapperStyle​

inner wrapper component styling (optional)

TypeDefault
object (style)inherited styling