Basic CSS text styling properties

CSS property name Description Example
font-family specifies a prioritized list of one or more font family names and/or generic family names for the selected element. "font-family: Georgia, serif;", "font-family: "Gill Sans", "sans-serif;"
font-size sets the size of the font "font-size: 12px;", "font-size: 80%;", "font-size: smaller;", "font-size: x-small;", "font-size: 1.2rem;"
font-style sets whether a font should be styled with a normal, italic, or oblique face from its font-family "font-style: normal;", "font-style: italic;", "font-style: oblique 40deg;"
font-weight Sets the weight (or boldness) of the font. The weights available depend on the font-family that is currently set. "font-weight: normal;", "font-weight: bold;", "font-weight: lighter;", "font-weight: 100;"
color Sets the foreground color value of an element's text and text decorations, and sets the currentcolor value. Currentcolor may be used as an indirect value on other properties and is the default for other color properties, such as border-color "color: rebeccapurple;", "color: #00a400;", "color: rgb(214, 122, 127);", "color: hsla(237deg 74% 33% / 61%);"
initial-letter Sets the size and sink for dropped, raised, and sunken initial letters. This property applies to ::first-letter pseudo-elements and inline-level first children of block containers. "initial-letter: normal;", "initial-letter: 3; /* 3 lines tall, baseline at line 3 */", "initial-letter: 3 2; /* 3 lines tall, baseline at line 2 (raised 1 line) */", "initial-letter: inherit;"
text-align sets the horizontal alignment of the inline-level content inside a block element or table-cell box "text-align: start;", "text-align: end;", "text-align: center;", "text-align: justify;"
text-transform specifies how to capitalize an element's text "text-transform: capitalize;", "text-transform: uppercase;", "text-transform: lowercase;", "text-transform: none;", "text-transform: math-auto;"
line-height Sets the height of a line box in horizontal writing modes. In vertical writing modes, it sets the width of a line box. It's commonly used to set the distance between lines of text. "line-height: normal;", "line-height: 2.5;", "line-height: 3em;", "line-height: 150%;", "line-height: 32px;"
letter-spacing sets the horizontal spacing behavior between text characters "letter-spacing: normal;", "letter-spacing: .2rem;", "letter-spacing: 1px;", "letter-spacing: -1px;"
word-spacing sets the length of space between words and between tags "word-spacing: normal;", "word-spacing: 1rem;", "word-spacing: 4px;", "word-spacing: -.4ch;"
font The font CSS shorthand property sets all the different properties of an element's font. Alternatively, it sets an element's font to a system font.Many font properties can also be set through the shorthand property font. These are written in the following order: font-style, font-variant, font-weight, font-stretch, font-size, line-height, and font-family. Among all those properties, only font-size and font-family are required when using the font shorthand property. A forward slash has to be put in between the font-size and line-height properties. "font: 1.2rem "Fira Sans", sans-serif;", "font: italic 1.2rem "Fira Sans", serif;", "font: small-caps bold 24px/1 sans-serif;"