Authority doesn't require austerity. A gentle top-to-bottom gradient wash from white to pale lavender, navy headlines that command without shouting, blue-gray body text that reads like a conversation, and a CTA button with a signature violet glow. This hero says: we handle serious things, but we're not going to make it feel serious.
Build, scale, and manage your revenue with tools designed for growth.
Build a Stripe-style warm gradient hero section. Design philosophy — warm authority: 1. Background: linear-gradient(180deg, #ffffff 0%, #f6f3ff 100%) — a barely-there lavender wash. The gradient is so subtle most users won't consciously notice it, but it prevents the "clinical white page" feeling. The purple tint subconsciously connects to Stripe's brand. 2. Headline: #0A2540 (Stripe's dark navy), 56-72px, -0.03em tracking, 700 weight. Navy reads as more trustworthy than black — it's a deliberate choice for fintech. Max-width 720px, centered. 3. Subtitle: #425466 (warm blue-gray), 20px, 400 weight, line-height 1.65, max-width 560px. This color is Stripe's secret weapon — it's warm enough to feel conversational but muted enough to not compete with the headline. 4. CTA group: Primary — #635BFF pill button with box-shadow 0 4px 14px rgba(99, 91, 255, 0.25). The glow makes the button feel alive. Secondary — #425466 text link, underline on hover. 5. Optional badge: A small rounded-full pill above the headline (border 1px solid #e6ebf1, text #425466, 13px) announcing something new. This creates a natural entry point for the eye. 6. Spacing: min-height 85vh. Content vertically centered with a slight upward bias. Horizontal padding should be generous (px-8). The result should feel like a premium financial product that you actually want to use.