Back to CSS Notes
Topic #43

Text Transformation

Text transformation changes case in CSS — uppercase, lowercase, capitalise. It styles text without touching the underlying content.


CSS Text Transformation

The CSS text-transform property is used to control the capitalization of text in an element.

It can be used to transform a text into uppercase or lowercase letters, or capitalize the first letter of each word, without changing the original content in HTML.

This property can have one of the following values:

  • none - No transformation. Text renders as it is
  • capitalize - Transforms the first character of each word to uppercase
  • uppercase - Transforms all characters to uppercase
  • lowercase - Transforms all characters to lowercase

Example

p.uppercase {
  text-transform: uppercase;
}

p.lowercase {
  text-transform: lowercase;
}

p.capitalize {
  text-transform: capitalize;
}

The CSS Text Transformation Property

Property Description
text-transform Controls the capitalization of text

Want to go beyond the notes?

Join Coding Now Tech Institute's CSS course — live mentorship, real projects, and 100% placement support.

Enroll Now — Free Demo Available

Text Transformation – FAQs

Quick answers about learning Text Transformation in CSS.

This free note from Coding Now Tech Institute explains Text Transformation in CSS — concept, syntax and worked code examples you can copy, run and revise before interviews.
Yes. Every CSS topic on Coding Now Tech Institute, including Text Transformation, is 100% free with no signup required.
With focused practice, most students grasp Text Transformation in 1–3 days from these notes; pairing it with Coding Now Tech Institute's mentor-led course takes you to job-ready depth faster.
Use the code examples in this note, then ask doubts for free on the Coding Now Tech Institute Community (/community) — expert instructors answer within 24 hours.
Call NowEnroll Now