text-transform | Frontend Practical Guide

Overview

The text-transform CSS property sets text case and capitalization.

Feature	Desktop				Mobile
Feature	Chrome	Edge	Firefox	Safari	Chrome Android	Safari iOS
`text-transform`	1	12	1	1	18	1
`capitalize`	1	12	1	1	18	1
`dutch ij digraph` Dutch `IJ` digraph			14
`full-size-kana`			64	17		17
`full-width`			19	17		17
`greek accented characters` Greek accented letters	34	79	15		34
`lowercase`	1	12	1	1	18	1
`lowercase sigma` `Σ` → `σ` or word-final `ς`	30	12	14	6	30	6
`none`	1	12	1	1	18	1
`turkic is` `i` → `İ` and `ı` → `I`	31	12	14	8	31	8
`uppercase`	1	12	1	1	18	1
`uppercase eszett` `ß` → `SS`	1	18	1	1	18	1

1+Supported (version) Not supported ※Has note Sub-feature descriptions sourced from MDN Web Docs (CC BY-SA 2.5)

CSS

.uppercase { text-transform: uppercase; }
.capitalize { text-transform: capitalize; }
.lowercase { text-transform: lowercase; }

CSS Uppercase(uppercase) demo.

CSS Capitalize(startuppercase) demo.

CSS Lowercase(lowercase) demo.

Using text-transform
The text-transform CSS property sets text case and capitalization.