ComponentsInputs & FormsSignup Form

Signup Form

Complete signup form with animated inputs, labels, and gradient submit button.

Preview

Signup Form

Interactive preview — import this component to see it in action

IO Context

Where IO uses this

Auth pages and onboarding flows.

Why this component matters

A polished form reduces friction. Smooth animations on focus and submit make the process feel effortless.

Usage guidance

Use for authentication pages. Include animated focus states, floating labels, and a gradient submit button with bottom glow effect.

Installation

bash

npx shadcn@latest add @aceternity/signup-form

Usage

example.tsxtsx

import { SignupForm } from "@/components/ui/signup-form";

export default function Example() {
  return (
    <SignupForm>
      {/* Your content here */}
    </SignupForm>
  );
}

Source

signup-form.tsx

components/ui/signup-form.tsx

View on GitHub

Related Components

Placeholders and Vanish Input

Inputs & Forms

File Upload

Inputs & Forms

Animated Modal

Overlays & Popovers