---
title: "Arc Curved Forms — Framer component · Best of Framer"
description: "$13.00 · Framer component · by Karim Saif · Forms. Screenshots, details, and remix links on Best of Framer."
canonical: "https://framer.elliotli.dev/component/arc-curved-forms"
---

[Home](/)/[Components](/components)/[Forms](/components/category/forms)/Arc Curved Forms

# Arc Curved Forms

Curved input forms

[View on Framer](https://framer.com/marketplace/components/arc-curved-forms/?via=elliot-li)

![Arc Curved Forms preview image 1](https://framer.elliotli.dev/og/component/arc-curved-forms/50ea6152ddf18dd5/1600x1046.jpg)

## Summary

Curved input forms

## Description

**Curved Arc Input for Framer** reimagines conventional form inputs into striking, curved UI elements. Built on clean mathematical geometry, the component dynamically maps input text, icons, and action triggers along a customizable vector path with configurable arch bending. Designed for high-performing web applications, it offers full feature parity with standard form elements—including auto or manual validation, real-time overflow handling, passive static renderer safety, and native accessible focus states.

## What It Does

-   **Dynamic Curved Geometry**: Smoothly transitions between flat layouts and pronounced arch curves ($archBend$) using procedural SVG path generation.
    
-   **SVG Text-on-Path Rendering**: Renders real-time text input directly along vector curves, complete with automatic text length calculations and sliding viewport alignment.
    

## What You Can Customize

All properties are exposed directly within the Framer property panel:

-   **Geometry & Layout**: Fine-tune component width, bar height, arch bend radius, inset spacing, and internal padding.
    
-   **Typography & Fonts**: Complete control over font families, weights, font styles, text sizes, and letter spacing for input and button text.
    
-   **Color Palette & Themes**: Configure individual background, border, focus state, text, placeholder, icon, and multi-state button colors.
    
-   **Validation & Messaging**: Toggle automatic vs. manual validation, set validation trigger points (submit, blur, change), and customize error strings for each input rule.
    
-   **Actions & Routing**: Set custom button actions (submit callback, external link, or internal redirect), destination URLs, tracking IDs, and tab targets.
    
-   **Shadows & Elevation**: Choose from built-in elevation presets (none, low, medium, high) with customizable drop-shadow colors.
    

## Need Help?

Have questions, need custom features, or want to share feedback? Reach out anytime at [karimsaif010@gmail.com](mailto:karimsaif010@gmail.com) or on X [@Karim Saif](/community/creator/@karim-saif/)

## Rank history [How rankings work →](/terms#rankings)

-   All · #7520

## Details

- **Author**: Karim Saif
- **Price**: $13.00
- **Published**: 2026-08-08
- **Updated**: 2026-09-16
- **Added**: 2026-08-08
- **Categories**: Forms

## More across types

-   [Wallble: Guest Book & Wall of Love](/plugin/wallble-guest-book-wall-of-love) — Wallble · Free — Guest book & Wall of Love

## More like this

-   [Stay Booking Pro](/component/stay-booking-pro) — Design Foundry · $10 — Stay Planner with Dynamic Pricing
-   [Postcode Checker](/component/postcode-checker) — Sean Weekes · $15 — Do we cover your area? (UK
-   [Property Calculators](/component/property-calculators) — Sean Weekes · $12 — UK Stamp Duty, mortgage and yield
-   [UTM Lead Capture](/component/utm-lead-capture) — Sean Weekes · $9 — See where every lead came from