Global

A scope that encompasses the entirety of an ecosystem. Entities that exist in a global scope are accessible from within any other scope making them a clear method of sharing values.

However, depending on permissions, it is also possible for one scope to affect the value of the globally referenced entity. This can cause unexpected results.

Example

CSS custom properties defined at the :root are considered global, accessible at any lower scope.

:root {
    --color-red-500: #F44336
}

In this example, any element within the page this CSS is placed upon will have access to use the --color-red-500 custom property.