Content Blocks
Editorial Mono
Editorial monochrome pricing section with typography focus.
pricingeditorialmonotypography
Props
Customize the component with these props
| Property | Type | Default | Description |
|---|---|---|---|
title | string | PRI | Section title text (first part). |
title2 | string | CING | Section title text (second part). |
subtitle | string | Select a tier that aligns with your ambition. Transparency is our only currency. | Section subtitle text. |
plans | Array<{name: string, price: number, number?: string}> | [] | Array of pricing plans with name, price, and optional number. |
features | string[] | [] | Array of feature strings to display. |
backgroundColor | string | #ffffff | Background color (hex, rgb, or hsl). |
borderColor | string | #000000 | Border color. |
sidebarBgColor | string | #ffffff | Sidebar background color. |
sidebarTextColor | string | #000000 | Sidebar text color. |
planNameColor | string | #000000 | Plan name text color. |
planNumberColor | string | #000000 | Plan number text color. |
priceColor | string | #000000 | Price text color. |
featureTextColor | string | #000000 | Feature text color. |
featureIncludedColor | string | rgba(0,0,0,0.3) | Feature included indicator color. |
buttonBorderColor | string | #000000 | Button border color. |
buttonTextColor | string | #000000 | Button text color. |
buttonHoverBgColor | string | #000000 | Button hover background color. |
buttonHoverTextColor | string | #ffffff | Button hover text color. |
footerText | string | (c) 2024 Design Systems Inc. All Rights Reserved. | Footer text. |
footerTextColor | string | #000000 | Footer text color. |
buttonText | string | Subscribe | Button text. |