Overview
In two months, I redesigned Squarespace Forms for every site with a form and every visitor filling one in. Working with a PM, TPM, four engineers, QA, accessibility and design systems, we rebuilt the oldest surface into a localized, accessible form system that inherits each site’s design.
Problem
Every field was hard-coded to US formats: a German address couldn’t submit because State was required. Visitors struggled with phone numbers, dates and addresses, leaving owners with broken lead, order and booking data. Correct date formats were the fourth-largest CMS request globally, and forms were our most-reported formatting issue.
Navigating ambiguity
I brought edge cases to weekly engineering and PM syncs. We chose a full rebuild with a reusable region service, site-country defaults at launch, independently formatted fields without limits, and native dropdowns styled to the site. To protect existing custom CSS, we planned a pro beta followed by a 2% traffic ramp.
Research
I audited every existing field, listened to support and community feedback, and studied real-world forms and phone libraries. I mapped address, phone and date formats across the top 20 locales, tested what styling a form entailed, and used Adam Silver’s Form Design Patterns to inform an inclusive redesign.
Shaping the direction
I turned a localization fix into a design upgrade. Every field needed rebuilding anyway, so inheriting site styles added little cost. I ran a design jam with accessibility and design systems to agree the standard: localized fields, Site Styles integration, accessibility by default, and a region service other teams could reuse.
North star
Expressive by default, safe by design. Customers wanted forms that matched their brand; the platform needed to keep them accessible and translatable. We chose site-level styling through tokens, not custom CSS per form: inherit fonts and colors while protecting focus and contrast, with localized strings built in from the start.
Forms that inherit the site’s design
Forms take their fonts and colors from Site Styles instead of looking like a separate product. Owners choose a form pack, then tune fill, shape, border and padding. The before-and-after examples show how the same form system adapts to different brands while staying part of each site.
One standard for every field
With accessibility and design systems, we standardized every input: “required” written out, labels and error messages above fields, fixed description contrast, white dropdowns that don’t look disabled, 2px focus rings, and appropriate ARIA labels. Address and phone examples show the same accessible treatment across localized fields.
Final solution
Every form block was rebuilt and localized, with a region service reused beyond forms. We shipped through QA rounds, an accessibility review, a pro beta, then a 2% traffic ramp with a rollback plan. Next steps were visitor-based defaults and checkout forms.
