---
title: "Revisiting form elements in Vanilla Framework\n    | Ubuntu"
description: 'Over the years, we’ve identified a number of areas for improvement when
  it comes to the basic building blocks of a form – inputs, buttons, etc: Long-standing
  complaints that inputs and buttons are too similar and therefore hard to distinguish
  “Noisiness” of long forms caused by the presence of borders around all sides of
  inputs  […]'
url: https://ubuntu.com/blog/revisitign-form-elements-in-vanilla-framework?format=md
keywords: index, follow
---

1. [Blog](https://ubuntu.com/blog)
2. Article

---

[Lyubomir Popov](https://ubuntu.com/blog/author/lyubomir-popov "More about Lyubomir Popov")

12 December 2022

# Revisiting form elements in Vanilla Framework

---

Share the article

Over the years, we’ve identified a number of areas for improvement when it comes to the basic building blocks of a form – inputs, buttons, etc:

* Long-standing complaints that inputs and buttons are too similar and therefore hard to distinguish
* “Noisiness” of long forms caused by the presence of borders around all sides of inputs and buttons

Last cycle, our proposal for updated form elements was discussed and approved, and in this iteration, we worked on implementing it in Vanilla, our front-end framework.

Before Vanilla 3.9:

After Vanilla 3.9:

* We’ve reduced the number of borders (all around) to the minimum required to satisfy WCAG contrast ratio requirements for interactive elements
* We’ve removed round corners from buttons and other elements, as part of a wider push to align better with the work of our Brand team
* We’ve introduced subtle transitions when interacting with form elements

This update also affects components that build on the functionality of form elements, like our search and Filter component:

The updated style was released as part of Vanilla 3.9.0 release.

[Version 3.9.0](https://github.com/canonical/vanilla-framework/releases/tag/v3.9.0) has just been released. You can see the updated form elements in action [here](https://vanillaframework.io/docs/base/forms)

[Get in touch

Interested in running Ubuntu in your organization?](https://ubuntu.com/about/contact-us/form)

## Newsletter signup

Get the latest Ubuntu news and updates in your inbox.

Work email:

\*I agree to receive information about Canonical's
products and services.

By submitting this form, I confirm that I have read and agree to [Canonical's Privacy Policy](https://canonical.com/legal/data-privacy).

Sign up

## Share on

---

## Related posts

[### How we create a Canonical Academy exam](https://ubuntu.com/blog/how-we-create-a-canonical-academy-exam)

Open source provides the world with access to cutting-edge software, and the learning that comes with it. But how do you validate someone’s skills in an open ecosystem?...

[Ishani Ghoshal](https://ubuntu.com/blog/author/ishanighoshal)

2 September 2026

[### Surviving the uncharted: when dedicated OpenStack expertise is your best ally in disaster recovery](https://ubuntu.com/blog/support-restores-openstack)

A customer’s OpenStack control plane went down overnight after their only backup proved stale. Canonical support rebuilt the database cluster live, service by service, without...

[Lidia Luna Puerta](https://ubuntu.com/blog/author/lidia-luna)

1 September 2026

[### Canonical joins the Open Secure AI Alliance](https://ubuntu.com/blog/open-secure-ai-alliance)

Canonical is now part of the Open Secure AI Alliance, announced by NVIDIA with partners across cloud computing, cybersecurity, enterprise software, open source foundations, and...

[Canonical](https://ubuntu.com/blog/author/canonical)

28 August 2026

[### AI harnesses for telco autonomous networks](https://ubuntu.com/blog/ai-harnesses-for-telco-autonomous-networks)

As the telco industry transitions toward Autonomous Networks Level 4, a fundamental architectural challenge has emerged: how do you build a secure, reliable and interoperable...

[estelacarmona](https://ubuntu.com/blog/author/estelacarmona)

28 August 2026
