Skip to content
Resources Logo Resources

Form Customization

This guide covers all the customization options available for your TextFlow signup forms.

Color Settings

Section titled “Color Settings”

Primary Color

Section titled “Primary Color”

The primary color affects:

  • Submit button background
  • Checkbox accent color when checked
  • Focus ring on form inputs

Default: #db2777 (TextFlow pink)

To change:

  1. Click the color swatch in the Appearance section
  2. Use the color picker or enter a hex code
  3. Preview updates in real-time

Tips for choosing primary color:

  • Match your brand’s primary color
  • Ensure sufficient contrast with white text
  • Test on both desktop and mobile

Background Color

Section titled “Background Color”

Sets the form container’s background color.

Default: #ffffff (white)

Common choices:

  • #ffffff - White (clean, professional)
  • #f9fafb - Light gray (subtle contrast)
  • #1f2937 - Dark gray (dark mode style)
  • Transparent - Inherits page background

Text Color

Section titled “Text Color”

Controls all text on the form including:

  • Title
  • Description
  • Field labels
  • Consent text
  • Error messages

Default: #111827 (dark gray)

Ensure contrast:

  • Light backgrounds need dark text
  • Dark backgrounds need light text
  • Test readability at different sizes

Typography

Section titled “Typography”

Form Title

Section titled “Form Title”

The main heading at the top of the form.

Customization options:

  • Leave blank to hide the title entirely
  • Keep titles short (3-5 words)
  • Use action-oriented language

Examples:

  • “Join Our VIP List”
  • “Get Exclusive Deals”
  • “Stay Connected”

Description

Section titled “Description”

Supporting text below the title.

Best practices:

  • Explain the value of subscribing
  • Mention frequency expectations
  • Keep under 2 sentences

Examples:

  • “Be the first to know about sales, new arrivals, and exclusive offers.”
  • “Get weekly tips and special member-only discounts.”

Button Customization

Section titled “Button Customization”

Button Text

Section titled “Button Text”

The text displayed on the submit button.

Default: “Subscribe”

Alternatives:

  • “Sign Up”
  • “Join Now”
  • “Get Started”
  • “Count Me In”
  • “Yes, I’m In!”

Tips:

  • Use action verbs
  • Keep it short (1-3 words)
  • Match your brand voice

Form Fields

Section titled “Form Fields”

Required vs Optional Fields

Section titled “Required vs Optional Fields”
FieldCan be hidden?Notes
Phone NumberNoAlways required
First NameNoAlways required
Last NameYesToggle on/off
EmailYesToggle on/off
Business/CompanyYesToggle on/off

Field Considerations

Section titled “Field Considerations”

Fewer fields = Higher conversion

Only collect information you’ll actually use:

  • Need to address customers by name? Keep First Name
  • Running B2B campaigns? Include Business/Company
  • Multi-channel marketing? Add Email
Section titled “Consent Customization”

Consent Text

Section titled “Consent Text”

The text next to the required checkbox.

Default:

I agree to receive SMS messages. Message and data rates may apply. Reply STOP to unsubscribe.

Customization guidelines:

Must include:

  • Acknowledgment of SMS messaging
  • Mention of potential carrier charges
  • Opt-out instructions

Can customize:

  • Wording and tone
  • Additional details about message frequency
  • Your business name

Example variations:

I consent to receiving promotional SMS messages from [Business Name].
Standard message and data rates may apply. Text STOP to opt out anytime.
Yes, send me text updates! I understand I may receive marketing messages
and can reply STOP to unsubscribe. Carrier rates may apply.

Design Best Practices

Section titled “Design Best Practices”

Contrast and Readability

Section titled “Contrast and Readability”
  • Maintain at least 4.5:1 contrast ratio for text
  • Test your form on mobile devices
  • Verify colors work for colorblind users

Brand Consistency

Section titled “Brand Consistency”
  • Use your brand’s exact hex colors
  • Match the tone of your website
  • Keep styling consistent across multiple forms

Mobile Optimization

Section titled “Mobile Optimization”

Forms are automatically responsive, but consider:

  • Testing on actual mobile devices
  • Using shorter titles on mobile
  • Keeping descriptions brief

Form Preview

Section titled “Form Preview”

Always preview your form before publishing:

  1. Make your customization changes
  2. Click Save Changes
  3. Click the Preview button
  4. Test on desktop and mobile views
  5. Submit a test entry

Common Customization Scenarios

Section titled “Common Customization Scenarios”

Professional/Corporate

Section titled “Professional/Corporate”
Primary Color: #2563eb (blue)
Background: #ffffff (white)
Text Color: #1f2937 (dark gray)
Button Text: "Subscribe"

Bold/Promotional

Section titled “Bold/Promotional”
Primary Color: #dc2626 (red)
Background: #fef2f2 (light red)
Text Color: #991b1b (dark red)
Button Text: "Get Deals Now!"

Minimal/Modern

Section titled “Minimal/Modern”
Primary Color: #000000 (black)
Background: #ffffff (white)
Text Color: #374151 (gray)
Button Text: "Join"

Dark Mode

Section titled “Dark Mode”
Primary Color: #8b5cf6 (purple)
Background: #1f2937 (dark gray)
Text Color: #f9fafb (light gray)
Button Text: "Sign Up"
Section titled “Related Documentation”