What Are Component Overrides in Figma?
Component overrides are modifications made to a component instance that differ from the main component—such as changed text, swapped icons, or adjusted colors—while maintaining the link to the source component.
Overrides vs. Detachment
Unlike detachment, overrides preserve the component connection. When you update the main component, instances receive those changes while keeping their overrides. This is the intended workflow—instances that differ in content but share structure and behavior with their source.
Healthy Override Patterns
Good overrides align with component design intent: changing button labels, swapping icon slots, toggling visibility of optional elements. These overrides use the flexibility built into the component through properties, variants, and slots.
Problematic Override Patterns
Override abuse happens when designers force changes the component wasn't designed for—resizing elements that break the layout, adding unapproved colors, or hiding structural elements. These overrides suggest the component needs new variants or properties, or that the designer should be using a different component entirely.
Monitoring Override Patterns
Tracking which overrides are most common reveals component gaps. If designers constantly override the same property, that's a signal to add it as a proper component property. Unusual override patterns might indicate training gaps or unclear component documentation.
Automate Your Design System Audits
ComponentQA automatically detects design system problems across your Figma files. Get actionable insights with deep links to fix issues where they live.