text-align

text-align: left;     /* default for LTR languages */
text-align: right;
text-align: center;
text-align: justify;  /* stretches lines to fill width */
text-align: start;    /* logical: left in LTR, right in RTL */
text-align: end;

text-decoration

/* Shorthand: line style color thickness */
text-decoration: underline;
text-decoration: line-through;
text-decoration: none;  /* removes underline from links */
text-decoration: underline wavy #6366f1;
text-decoration: underline solid 2px;

/* Sub-properties */
text-decoration-line: underline overline line-through;
text-decoration-style: solid dashed dotted double wavy;
text-decoration-color: #6366f1;
text-decoration-thickness: 2px;

/* Underline offset (gap between text and underline) */
text-underline-offset: 4px;

Spacing Properties

/* Space between letters */
letter-spacing: 0.05em;   /* tracking */
letter-spacing: -0.02em;  /* tight (for headings) */

/* Space between words */
word-spacing: 0.1em;

/* Line height */
line-height: 1.5;          /* unitless — relative to font-size (recommended) */
line-height: 1.75;         /* comfortable reading */
line-height: 24px;         /* fixed — avoid for text */

/* Indentation */
text-indent: 1.5em;        /* first-line indent */

/* text-transform */
text-transform: uppercase;
text-transform: lowercase;
text-transform: capitalize;  /* first letter of each word */
text-transform: none;

text-overflow & white-space

/* Single-line truncate */
.truncate {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* white-space values */
white-space: normal;    /* default — wraps at spaces */
white-space: nowrap;    /* no wrapping */
white-space: pre;       /* preserves whitespace and newlines */
white-space: pre-wrap;  /* preserves whitespace, allows wrapping */
white-space: pre-line;  /* collapses spaces, preserves newlines */

/* Multi-line clamp */
.clamp-3 {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
}

writing-mode & direction

/* Vertical text */
writing-mode: vertical-rl;   /* right to left */
writing-mode: vertical-lr;   /* left to right */

/* RTL language support */
direction: rtl;
unicode-bidi: bidi-override;

/* Logical properties (work in all writing modes) */
margin-inline-start: auto;   /* left in LTR, right in RTL */
padding-block: 16px;         /* top and bottom */
← PreviousfontNext →CSS Custom Properties