RVT.ai

Kite: Paper Plane Contact Form

by @rvtNo reviews yet0 sales

A playful React contact form whose send button launches a paper plane: it flies to centre, turns green, rides the wind lines and lands a success message.

Open live preview (opens in a new tab)Runs in a sandbox · no sign-up needed

Try it live

The real demo, running in a sandbox. Switch the screen size to see how it adapts.

About this item

Kite makes getting in touch feel rewarding. A clean card with name, email and message fields sits beside soft background circles and motion lines; press send and a paper plane takes off, flashes green, is carried away on animated wind lines and a "Sent Successfully!" message appears exactly as it reaches the corner.

A choreographed send sequence

Framer Motion animation controls run the flight in stages: fly to centre, colour change, wind, and fly-away to the top corner, then reveal the success state.

Ready for real forms

Name, email and message fields, social icons and a clear success state; hook the submit handler up to your API, Formspree or email service.

Features

  • ✓Contact form with name, email and message
  • ✓Multi-stage paper plane send animation
  • ✓Colour change and wind-line effects
  • ✓Animated success message
  • ✓Decorative background circles and motion lines
  • ✓Social icon links
  • ✓Framer Motion animation controls
  • ✓Single component + CSS file

What's included
Full JavaScript source code, package.json with locked dependencies, Vite config, RVT.ai README with setup and customisation guide, LICENSE and THIRD-PARTY-NOTICES.md. No node_modules: run npm install once.

Requirements
Node.js 20.19+ and npm 10+ to develop and build. The production build is static HTML, CSS and JavaScript that runs on any static host. No backend, API keys or paid services required.

Perfect for

  • Contact and support pages
  • Agency and portfolio sites
  • Newsletter and waitlist sign-ups
  • Feedback widgets

From download to production

  1. Download Kite: Paper Plane Contact Form from your account and unzip it.
  2. Run npm install, then npm run dev to open it locally.
  3. Swap in your brand colours, copy and data (see the README customisation guide).
  4. Run npm run build and deploy the dist/ folder to any static host.

Support and updates
Includes free updates and six months of RVT.ai support. Ask pre-purchase questions in the product Q&A, or open a ticket at https://rvt.ai/support with your order number.

Choose the license for your project

A Regular license covers a single end product that is not sold to end users. Choose Extended for a single end product that is sold to end users, including SaaS products and paid applications. Review the full license terms before checkout.

Features

  • Contact form with name, email and message
  • Multi-stage paper plane send animation
  • Colour change and wind-line effects
  • Animated success message
  • Decorative background circles and motion lines
  • Social icon links
  • Framer Motion animation controls
  • Single component + CSS file

Files included

  • Full source code (React + Vite)
  • README.md
  • LICENSE (RVT.ai)
  • THIRD-PARTY-NOTICES.md
  • package.json + package-lock.json

Version 1.0.0 and changelog

  1. Version 1.0.0

    Initial RVT.ai release.