Auth

Sign Up

A centered sign-up form with full name, email, and password fields. Includes inline validation, a terms/privacy footer, and a link back to the login page.

Create account

Create your account to get started.

By creating an account you agree to our Terms and Privacy Policy.

Already have an account? Sign in

import { SignUp } from "@aetherstack/blocks"

Installation

terminal

npx aether-ui add signup-block

Import

import.tsx

import { SignupBlock } from "@aetherstack/blocks"

Usage

sign-up.tsx

import { SignupBlock } from "@aetherstack/blocks"

export default function SignupPage() {
  return (
    <SignupBlock
      appName="Acme"
      tagline="Create your account to get started."
      onSubmit={async ({ name, email, password }) => {
        await createAccount({ name, email, password })
      }}
      signInHref="/login"
      termsHref="/terms"
      privacyHref="/privacy"
    />
  )
}

Props

Prop	Type	Default	Description
appName	string	"Aether UI"	Product name displayed above the form.
tagline	string	—	Short tagline below the app name.
onSubmit	(values: { name, email, password }) => void	—	Called with validated form data on submit.
signInHref	string	"/login"	URL for the existing account sign-in link.
termsHref	string	"/terms"	URL for the terms of service link in the footer.
privacyHref	string	"/privacy"	URL for the privacy policy link in the footer.
className	string	—	Additional classes on the root wrapper.

* Required

Accessibility

→All form fields are labelled via visible labels and htmlFor/id associations.
→Inline validation errors are rendered adjacent to each field.
→The password field uses type="password" for native browser masking.
→Terms and privacy links open in the same tab by default — set target="_blank" if needed.