Uilora
Uilora.
Uilora
Uilora.
Content Blocks
Playground

Soft Cloud

Soft minimal cloud pricing cards with gentle aesthetics.

pricingsoftcloudminimal

Props

Customize the component with these props

PropertyTypeDefaultDescription
title
stringSimple plans for everyone.Section title text.
plans
Array<{name: string, price: number, description?: string, badge?: string, iconColor?: string, iconBgColor?: string, buttonBgColor?: string, buttonTextColor?: string, buttonHoverBgColor?: string}>[]Array of pricing plans with name, price, description, badge, and optional styling props.
features
string[][]Array of feature strings to display.
backgroundColor
string#F0F4F8Background color (hex, rgb, or hsl).
titleColor
string#1e293bTitle text color.
cardBgColor
string#ffffffCard background color.
cardShadowColor
stringrgba(0,0,0,0.05)Card shadow color.
cardBorderColor
string#ffffffCard border color.
planNameColor
string#0f172aPlan name text color.
planDescColor
string#94a3b8Plan description text color.
priceColor
string#0f172aPrice text color.
priceSubtextColor
string#94a3b8Price subtext color.
featureTextColor
string#0f172aFeature text color.
featureCheckBgColor
string#f1f5f9Feature check background color.
featureCheckColor
string#0f172aFeature check icon color.
badgeBgColor
string#c7d2feBadge background color.
badgeTextColor
string#6366f1Badge text color.
defaultButtonBgColor
string#f1f5f9Default button background color.
defaultButtonTextColor
string#0f172aDefault button text color.
defaultButtonHoverBgColor
string#e2e8f0Default button hover background color.
buttonText
stringGet StartedButton text.
Soft Cloud - Content Blocks Component | UILora