appearanceBaseline · Widely available
The appearance CSS property controls the appearance of form controls. Using appearance: none disables any default native appearance and allows the elements to be styled with CSS.
Supported in all major browsers for at least 30 months — safe to use without fallbacks. Baseline since Mar 14, 2022. Widely available since Sep 14, 2024.
Browser support
DesktopChrome
1–83Not supported
84+Supportedsince Jul 27, 2020
Current: 155Edge
12–83Not supported
84+Supportedsince Jul 16, 2020
Current: 154Firefox
1–79Not supported
80+Supportedsince Aug 25, 2020
Current: 157Safari
1–15.3Not supported
15.4+Supportedsince Mar 14, 2022
Current: 27MobileChrome Android
18–83Not supported
84+Supportedsince Jul 27, 2020
Current: 155Firefox Android
4–79Not supported
80+Supportedsince Aug 31, 2020
Current: 157Safari iOS
1–15.3Not supported
15.4+Supportedsince Mar 14, 2022
Current: 27How to use
This feature is Baseline widely available — use it freely, no fallback needed.
Example
Full syntax and examples are on MDN: appearance.
Feature detection
CSS · check before using
@supports (appearance: initial) {
/* styles that rely on appearance */
}
/* or in JavaScript */
if (CSS.supports("appearance", "initial")) {
// use it
}Documentation (MDN)
Specification
Usage share
Sub-features
Support for each part of the feature (14). The overall table above shows when the whole feature works.
| Sub-feature | Chrome | Edge | Firefox | Safari | Chrome Android | Firefox Android | Safari iOS |
|---|---|---|---|---|---|---|---|
| appearance | 84 | 84 | 80 | 15.4 | 84 | 80 | 15.4 |
| appearance.auto | 84 | 84 | 80 | 15.4 | 84 | 80 | 15.4 |
| appearance.button | 84 | 84 | 80 | 15.4 | 84 | 80 | 15.4 |
| appearance.checkbox | 84 | 84 | 80 | 15.4 | 84 | 80 | 15.4 |
| appearance.listbox | 84 | 84 | 80 | 15.4 | 84 | 80 | 15.4 |
| appearance.menulist | 84 | 84 | 80 | 15.4 | 84 | 80 | 15.4 |
| appearance.menulist-button | 84 | 84 | 80 | 15.4 | 84 | 80 | 15.4 |
| appearance.meter | 84 | 84 | 80 | 15.4 | 84 | 80 | 15.4 |
| appearance.none | 84 | 84 | 80 | 15.4 | 84 | 80 | 15.4 |
| appearance.progress-bar | 84 | 84 | 80 | 15.4 | 84 | 80 | 15.4 |
| appearance.radio | 84 | 84 | 80 | 15.4 | 84 | 80 | 15.4 |
| appearance.searchfield | 84 | 84 | 80 | 15.4 | 84 | 80 | 15.4 |
| appearance.textarea | 84 | 84 | 80 | 15.4 | 84 | 80 | 15.4 |
| appearance.textfield | 84 | 84 | 80 | 15.4 | 84 | 80 | 15.4 |