Text Style

A saved combination of font, size, weight, spacing, and color settings that can be applied consistently to text elements. Text styles ensure typographic consistency and make global updates efficient—change the style, update all instances. Build a systematic hierarchy with styles for headings, body, captions, and other text types.

Related terms

Related terms

  • Heading Hierarchy

    Accessibility

    The structured use of heading levels (H1-H6) to organize content and communicate importance to users and search engines. Proper heading hierarchy improves accessibility, SEO, and content scanability. Use only one H1 per page and don't skip levels for visual styling. See Text styles and semantic tags.

  • Letter Spacing

    Typography

    The uniform adjustment of space between all characters in a word or block of text, also called tracking. Increased letter spacing can improve readability for uppercase text and small sizes. Avoid negative letter spacing in body text as it impairs readability.

  • Line Height

    Typography

    The vertical space allocated to each line of text, affecting readability and overall text block appearance. Proper line height prevents cramped or overly loose text—typically 1.4-1.6 for body copy. Adjust line height proportionally with font size for consistent rhythm.

  • Link

    Interaction

    An interactive element that navigates users to another page, section, or resource when clicked. Links are the fundamental building blocks of web navigation and interconnected content. Style links consistently throughout your site with clear visual distinction from surrounding text.

  • Stroke

    Design

    The border or outline applied to shapes and text, defined by weight, color, and style like solid, dashed, or dotted. Strokes add definition, create contrast, or achieve specific visual styles like outlined buttons. Framer offers stroke controls including width, color, and position (inside, center, outside).

  • Style

    Design

    A saved set of visual properties—colors, typography, effects—that can be applied consistently across elements. Styles enable design system consistency and make global updates efficient. In Framer, text and color styles ensure brand coherence throughout your project.

  • Hyperlink

    General

    A clickable connection between pages or resources, the fundamental navigation mechanism of the web. Hyperlinks should have descriptive text indicating their destination rather than generic ‘click here’ labels. Style links consistently with clear visual distinction from surrounding text.

  • Style Guide

    Design

    Documentation defining a brand’s visual standards including colors, typography, spacing, and component usage rules. Style guides ensure consistency across team members, projects, and time. Maintain living style guides that evolve with your design system.

  • Combo Classes

    Design

    Combo Classes extend a base CSS class with targeted style changes, allowing reusable variants without duplicating entire style definitions.

  • Points

    Typography

    Points are a standard unit in typography for sizing text and related spacing, where 1 point equals 1/72 of an inch.

  • Serif

    Typography

    Serif typefaces include decorative terminal strokes that can convey tradition, credibility, and reading comfort in long-form text.

  • Text decoration

    Typography

    Framer text decoration helps designers style links, emphasis, and editorial details while keeping type treatments consistent across a site.

  • Text balance

    Typography

    In Framer, balanced text can make headlines and supporting copy feel more intentional across screen sizes by reducing awkward single-word lines.