Back

SaaS Hero with Animated Background

Full-width SaaS landing hero with animated gradient background and floating elements.

Category
HeroReact
CSS
Custom CSS

Manual

Create a file and paste the following code into it.

src/App.tsx
1
2
3
4
5
6
7
8
9
10
11
import { CTASection } from "@/components/hero-dithering-card";

function App() {
  return (
    <div className="flex h-dvh w-full items-center justify-center">
      <CTASection />
    </div>
  );
}

export default App;

Update the import paths to match your project setup.

Similar screens

Pulse Stripes Layout0
Shaders Hero Section18