Figma Styles beta: A new way to apply text and layer attributes | Figma Blog

Figma’s 2018 Styles beta introduced a modular system for applying text and layer attributes consistently across documents. Instead of bundling typography, color, and alignment into complex combinations, Styles separated them so each could be managed and updated independently. The feature also allowed different styles within a single text field, making design systems easier to maintain for both individuals and teams.

Modular Text and Layer Styles

• Styles could be created separately for:
  • Text properties
  • Fills and colors
  • Layout grids
  • Effects
  • Strokes
• Styles were available through team libraries, helping teams share current versions.
• Team members could enable shared Styles and receive notifications when they changed.

Reducing Text Style Complexity

• Traditional tools combined font, color, and alignment into a single text style.
• A project with three text formats and three colors could require nine separate styles, even before accounting for alignment.
• Changing a color—such as an inaccessible light-gray link color—required manually updating every affected style.
• Figma separated form, color, and alignment so each attribute could be edited independently.
• Updating a source fill style automatically propagated the change throughout the design.

Applying Multiple Styles Within Text Fields

• Other design tools often restricted a text field to one style.
• Formatting part of a sentence as a link or section heading could break its connection to the original style.
• Figma allowed users to highlight portions of text and apply different text or fill styles.
• These partial styles retained their links to the source styles and updated when those styles changed.

Beta Rollout

• The private beta was intended to reduce daily styling problems and support scalable team design systems.
• Migration was planned to begin with smaller teams before larger ones.
• The migration was one-way, so teams needed to consider the change before participating.

Figma recommended Styles as a more flexible foundation for consistent design systems, especially for teams managing shared typography and visual attributes at scale.