Hero Bank

Hero Bank is a hero section designed for a bank, inspired by a Dribbble design. The layout is divided into three sections: newsletter, phone, and numbers, each carefully crafted using CSS grid for precise control over dimensions. With a mobile-first approach, I ensured seamless responsiveness across devices, utilizing Tailwind CSS and clsx for conditional styling. Flex properties were employed to maintain harmony in design, with each section dynamically adjusting its width and height.

Tech Stack:

• TypeScript
• React
• Next.js
• Tailwind CSS
• clsx

Notes:

• Developed with a mobile-first design approach for optimal responsiveness.
• Utilized CSS grid for precise layout control and flexibility.
• Tailwind CSS and clsx were used for streamlined styling and conditional class application.
• Flex properties were employed to maintain design harmony and responsiveness.