Phone split hero

App launch hero with an email capture on the left and an app screen in an iPhone frame.

Library

Velora UI

Framework

React

Type

block

License

MIT

Dependencies

lucide-react

Install

npx shadcn@latest add https://velora.colorlib.com/r/hero-split-phone.json

Files

• src/components/blocks/hero-split-phone.tsx
• src/components/velora/blur-fade.tsx
• src/components/velora/iphone-mockup.tsx
• src/components/velora/ripple.tsx
• src/lib/utils.ts
• src/components/ui/button.tsx
• src/components/ui/input.tsx
• src/components/ui/label.tsx

Source

https://github.com/ColorlibHQ/velora-ui

Categories

• Form Components
• React Form Components
• Tailwind CSS Form Components
• shadcn/ui Form Components
• Hero Components
• React Hero Components
• Tailwind CSS Hero Components
• shadcn/ui Hero Components
• Input Components
• React Input Components
• Tailwind CSS Input Components
• shadcn/ui Input Components

More from Velora UI

• Split login page
• Sign-up card
• Browser Mockup
• Container Scroll
• Newsletter sign-up
• Split CTA with product visual
• Alternating screenshot rows
• Tabbed product tour
• Newsletter footer
• Aurora hero
• Globe split hero
• Developer tool hero