Plan

The plan component lets you define what type of plan your product needs. There are two ways to use it: in the main Overview page of your product, or in a page where you need to talk about a specific feature with additional requirements.

In the Overview page, use <Plan type="<PLAN_TYPE>" /> To specify a special feature use <Plan id="<FIRST_PRODUCT>.<SECOND-PRODUCT>.properties.availability.summary" />. This component pulls information from the index.json file in src/content/plans/.

Refer to the examples below for more information.

Available on all plans

Available on Paid plans

Pro and above

Business and above

Add-on feature

Enterprise-only paid add-on

Available on Free and Paid plans

Available on Workers Paid plan

Paid add-on

import { Plan } from "~/components"

<Plan type="all" />
<Plan type="paid" />
<Plan type="pro" />
<Plan type="business" />
<Plan type="add-on" />
<Plan type="ent-add-on" />
<Plan type="workers-all" />
<Plan type="workers-paid" />
<Plan id="web3.ethereum.properties.availability.summary" />