Suggest an editImprove this articleRefine the answer for “What is encapsulation in Angular components?”. Your changes go to moderation before they’re published.Approval requiredContentWhat you’re changing🇺🇸EN🇺🇦UAPreviewTitle (EN)Short answer (EN)**`encapsulation`** in Angular components determines how a component's styles are applied to the DOM and isolated from other components. **Key point:** the main purpose of encapsulation is to control the scope of CSS and prevent style conflicts between components.Shown above the full answer for quick recall.Answer (EN)Image`encapsulation` in Angular components determines how a component's styles are applied to the DOM and isolated from other components. Angular supports three modes: 1. `ViewEncapsulation.Emulated` **(default)** - the component's styles are virtually isolated by adding attributes to elements. They apply only inside the component, but the browser sees regular CSS. 2. `ViewEncapsulation.None` - the component's styles are global and affect all elements in the application, there is no isolation. 3. `ViewEncapsulation.ShadowDom` - uses the browser's native Shadow DOM; styles are fully isolated and do not affect other components. > The main purpose of `encapsulation` is to control the scope of CSS and prevent style conflicts between components.For the reviewerNote to the moderator (optional)Visible only to the moderator. Helps review go faster.