Plan picker with a monthly vs yearly pill toggle, dynamic price, and a savings chip on the yearly side.
Turn the props on the right; the snippet under them is what you would write to get what you see.
import { Card13 } from "@/components/beste/component/card13";
<Card13
billing="yearly"
monthlyPrice="$19"
yearlyPrice="$15"
savings="Save 20%"
/>The import and the props worth knowing about, in one place.
import { Card13 } from "@/components/beste/piece/card13";
<Card13
billing="yearly"
monthlyPrice="$19"
yearlyPrice="$15"
savings="Save 20%"
/>Pricing tier with a headline amount, period, and a stack of check-marked features. Featured tier flips to primary.
Consumption plan card with a per-unit rate, a bubble of included volume, and an overage note below.
One-time credit bundle card with a coin tile, bonus chip, per-credit rate, and a Top up CTA.
Standard plan tile with a uppercase name, big price, tagline, four feature bullets, and an outline CTA.