Azure Fintech Pricing
A premium three-tier pricing block designed for fintech and payment platforms.
Features
- Three-tier pricing cards — Starter, Pro, and Enterprise with distinct feature sets
- Feature comparison table — Full grid comparing all features across plans
- Geometric hexagonal SVG pattern — Subtle background texture for visual depth
- Cyan glow highlight — Popular plan stands out with animated border glow
- IBM Plex typography — IBM Plex Sans for headings, IBM Plex Mono for numbers
- Trust bar — Security certifications and compliance badges
- Light/dark mode — Full WCAG AA compliant color contrast in both modes
Dependencies
lucide-vue-next — Check, X, Zap, Shield, CreditCard icons@/components/vue-ui/card — Shadcn-Vue Card components@/components/vue-ui/button — Shadcn-Vue Button@/components/vue-ui/badge — Shadcn-Vue Badge@/components/vue-ui/separator — Shadcn-Vue Separator
Customization
- Plans: Modify the
plans array to change pricing tiers and prices
- Features: Edit the
features array for the comparison table
- Colors: Swap cyan/blue accents for your brand colors
- Typography: Replace IBM Plex with your preferred font family
