> Portal Navigation:
> 
> - Append `.md` to any URL under `https://dev.wix.com/docs/` to get its markdown version.
> - Pages are either content pages (article or reference text) or menu pages (a list of links to child pages).
> - To get a menu page, truncate any URL to a parent path and append `.md` (e.g. `https://dev.wix.com/docs/sdk.md`, `https://dev.wix.com/docs/sdk/core-modules.md`).
> - Top-level index of all portals: https://dev.wix.com/docs/llms.txt
> - Full concatenated docs: https://dev.wix.com/docs/llms-full.txt

## Resource: How the Editor Resolves CSS Property Values

## Article: CSS Property Value Resolution

## Article Link: https://dev.wix.com/docs/build-apps/develop-your-app/extensions/site-extensions/editor-react-components/manifest-reference/editor-element/css/how-the-editor-resolves-css-property-values.md

## Article Content:

import { Property, PropertyList } from "@wix/docs-ui/content";


# How the Editor Resolves CSS Property Values
<blockquote className="caution">

__Alpha:__
Editor React Components are currently in alpha. This feature is subject to change and may have bugs, issues, and limitations. We're actively improving it based on your feedback.

</blockquote>


When multiple styling sources exist for the same property, understanding which value is used is essential. This guide explains how CSS property values are resolved.

## CSS property hierarchy

The editor resolves which value to apply in this order, from lowest to highest priority:

<PropertyList bordered>
  <Property
    name="CSS file"
    type="Priority 1 (lowest)"
    description="Fallback styles before the editor applies inline styles."
  />
  <Property
    name="Manifest defaults"
    type="Priority 2"
    description="Style defaults defined in defaultValue override the CSS."
  />
  <Property
    name="Preset defaults"
    type="Priority 3"
    description="Overrides manifest defaults when a preset is selected. Properties not defined in the preset use manifest defaults."
  />
  <Property
    name="User customization"
    type="Priority 4 (highest)"
    description="Any change the Wix user makes in the editor overrides all."
  />
</PropertyList>

## CSS properties vs. CSS custom properties

The hierarchy above applies to both `cssProperties` and `cssCustomProperties`, but they're applied differently. The editor applies `cssProperties` as inline styles, which automatically override your CSS file. For `cssCustomProperties`, the editor sets CSS variables on the element, but your CSS file must reference them with `var()` for the values to take effect.

## Switching between presets

User customizations are tied to the active preset. Switching to a different preset resets any customizations the Wix user made. If they switch back, the preset's original defaults are restored, not the Wix user's previous customizations.

## CSS in states

[States](https://dev.wix.com/docs/build-apps/develop-your-app/extensions/site-extensions/editor-react-components/manifest-reference/editor-element/states.md) aren't a separate priority level. Both the manifest and presets can define state-specific values using `statesDefaultValues`. The current state determines which value to read from whichever set of defaults is active.

## Display filters

Display filters control which properties are visible to the user in the editor, not which values take priority. They follow their own narrowing order: Element filters apply first, then preset filters, then state filters. See [Display Filters](https://dev.wix.com/docs/build-apps/develop-your-app/extensions/site-extensions/editor-react-components/manifest-reference/editor-element/display-filters.md) for details.

{/* ## See also */}