Graphene AI Comparison
A neon cyberpunk comparison table designed for AI/ML companies, SaaS platforms, and developer tool providers.
Features
- 3 tier comparison: Lite ($29/mo), Pro ($99/mo), Enterprise (Custom)
- 6 feature comparison rows with checkmarks, x-marks, and text values
- Electric cyan (#00E5FF) neon accents with glowing box-shadow effects
- "Most Popular" badge on the highlighted Pro tier
- Light mode: dark gray (#1E1E2E) background preserving the neon aesthetic
- Dark mode: pure black (#000000) background for maximum neon contrast
- Alternating row backgrounds for readability
- Tier header cards with icons and pricing
- Responsive with horizontal scroll for the comparison table on small screens
- WCAG AA compliant contrast for all text content
Usage
import RegistryItem from './registry-item';
export default function PricingPage() {
return <RegistryItem />;
}
Customization
- Update the
tiers array with your actual pricing and tier names
- Modify the
features array to reflect your product's feature matrix
- Adjust the neon cyan (#00E5FF) accent to your brand's highlight color
- Add CTA buttons below each tier card for sign-up flows
- Integrate with Stripe or a payment provider for checkout
