---
title: "Smart Form Fields — Free Framer component · Best of Framer"
description: "Free Framer component · by Farhan Malik · Forms. Update 1.5 Now you can add the Country Code in \"Tel Field\" Update 1.4 Optimize the code Now you can customize the field layout paying…"
canonical: "https://framer.elliotli.dev/component/smart-form-fields"
---

[Home](/)/[Components](/components)/[Forms](/components/category/forms)/Smart Form Fields

# Smart Form Fields

Making Forms Advance

[View on Framer](https://framer.com/marketplace/components/smart-form-fields/?via=elliot-li)

![Smart Form Fields preview image 1](https://framer.elliotli.dev/og/component/smart-form-fields/4982e1d6e252dbe1/1600x1200.jpg)

## Summary

Update 1.5 Now you can add the Country Code in "Tel Field" Update 1.4 Optimize the code Now you can customize the field layout paying with field width Can adjust Vertical &…

## Description

### Update 1.6

-   Fixed a bug where fields could end up sharing the same ID, causing values to mix between fields
    
-   Now you can set Min & Max Value for Number fields
    

## Smart Form Fields

A powerful add-on for the default Framer Form system. Build dynamic, logic-driven, fully customizable forms without code. Adds conditional visibility, calculations, notes, and hidden inputs, while native Framer submission keeps working underneath. Great for onboarding flows, multi-step funnels, product configurators, lead capture, surveys, and quotation calculators.

How to Use

Place the component inside a native Framer Form so submissions still go through Framer's own handling. Open the Fields array and build field by field, each type shows only the settings relevant to it.

Field Types

Text, Email, Tel (with optional country code), Number (min/max/step), Select, Checkbox, Radio, Date, Time, Textarea, Calculation, Hidden, Note. Each supports full style control, background, text color, borders, padding, and spacing.

Calculation Field

Automatically computes a value using a formula referencing other field IDs, like price times quantity plus tax, with optional prefix/suffix formatting. Perfect for quotations, configurators, cost estimators, and donation forms needing instant updates.

Conditional Logic

Show or hide any field based on another field's value. Build branching flows that adapt to user choices, ideal for progressive forms, guided configuration, upgrade selectors, and custom pricing logic.

Styling Controls

Customize input background, text color, borders, padding, corner radius, spacing, and layout. Style globally or per field, no CSS required.

Questions? Reach out at [askdesignustaad@gmail.com](mailto:askdesignustaad@gmail.com)

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

-   All · #1523

## Details

- **Author**: Farhan Malik
- **Published**: 2025-11-18
- **Updated**: 2026-09-03
- **Added**: 2025-11-07
- **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