Drop Cap

Englarges the first letter of a paragraph to span multiple lines, creating a classic drop cap element.

Drop caps, with their graceful and ornate presence, bestow upon written works an aura of elegance and sophistication. These typographical gems, like the first strokes of a painter's brush on a canvas, captivate the reader's eye and beckon them into the world of words. They lend an air of timeless charm and vintage allure, invoking the spirit of centuries past while infusing modern texts with an irresistible allure. Aesthetic enchantment aside, drop caps enhance readability by guiding the reader's gaze and ushering them gracefully into the heart of the narrative. In their embrace, we discover that the art of typography is not merely functional but a sublime marriage of form and function, enriching the written word with both visual splendor and literary resonance.

Unlock with Framestack Pro

Get over 60 components and code overrides for building websites with Framer!
No subscription - pay once, use forever.

Type

Code Override

Free

Last Updated

May 17, 2024

Instructions

In your Framer project, navigate to the Assets tab and create a new code file. Replace the example code with the code override, then add it to a layer in the "Code Override" section of the properties panel.

Add the override to a text layer, then rename the layer like this: "Lines: #, Height: #" with lines # being the height of the drop cap in lines of text and the height # being the text's line height.

This override may not work on all browsers. See CSS initial-letter.

Framestack

Built with

Framer

Pages

Affiliate Program

Framer Plugins