import React from 'react'; import { FaBitcoin, FaEthereum } from 'react-icons/fa'; import { SiBinance } from 'react-icons/si'; import { TrendingUp, TrendingDown, ArrowRight } from 'lucide-react'; import { ArrowRightIcon } from '@heroicons/react/20/solid'; import { BiTrendingDown, BiTrendingUp } from 'react-icons/bi'; // Customizable Text Content const content = { headingPrimary: "Level Up Your", headingHighlight: "Crypto Journey", description: "Join over 210 million users trusting our platform for secure, efficient, and innovative cryptocurrency trading and management.", buttonPrimary: "Get Started", buttonSecondary: "Learn More", trendingHeader: "Trending Coins", trendingLinkText: "See All", }; // Customizable Theme Configuration const theme = { gradientDirection: "to-b", bgGradientFrom: "from-gray-950", bgGradientTo: "via-gray-900 to-black", highlightTextFrom: "from-teal-400", highlightTextTo: "to-blue-500", buttonGradientFrom: "from-teal-500", buttonGradientTo: "to-blue-500", buttonHoverGradientFrom: "hover:from-teal-600", buttonHoverGradientTo: "hover:to-blue-600", border: "border-gray-800/30", iconBg: "text-teal-400", }; // Trending Coins Data const trendingCoins = [ { icon: FaBitcoin, name: 'Bitcoin', symbol: 'BTC', price: '$62,919.48', change: '+4.91%' }, { icon: FaEthereum, name: 'Ethereum', symbol: 'ETH', price: '$3,361.59', change: '+5.27%' }, { icon: SiBinance, name: 'BNB', symbol: 'BNB', price: '$559.90', change: '+4.11%' }, ]; // Heading Component const Heading: React.FC = () => (

{content.headingPrimary} {content.headingHighlight}

{content.description}

); // Trending Coins Component const TrendingCoins: React.FC = () => (

{content.trendingHeader} {content.trendingLinkText}

{trendingCoins.map((coin, index) => (

{coin.name}

{coin.symbol}

{coin.price}

{coin.change.startsWith('+') ? ( ) : ( )} {coin.change}

))}

); // Main CryptoHeroSection Component const CryptoHeroSection: React.FC = () => { return (

{/* Animated background elements */}

); }; export default CryptoHeroSection;

Table Components

Glassmorphic Hero Section

Crytpo Glassmorphic Table