Drop Cap

How to make the first letter of a paragraph larger in size.

Copy: View demo

Dependencies

All components are built upon the CodyHouse Framework.

How to

The Drop Cap component is a decorative snippet used to make the first letter of a paragraph larger. It's generally applied to <p> elements.

Edit the --drop-cap-lines variable to set the number of lines occupied by the first letter.

:root {
  --drop-cap-lines: 3; // number of lines occupied by the first letter
}

Bug Report & Feedback

Get in touch: suggest a component or report a bug.

💌 Join our newsletter

Be the first to know when we ship something cool!