Intro

Double-click on any empty Style Cell to bring up a list of default style inputs to choose from.

Note: In the example above, you can set up the correct value for the Text Shadow property without knowing the exact CSS syntax. Once this default value is there (5px 5px #558abb), you can edit it to match your site. Additionally, this interaction can help you deconstruct and learn the syntax (In this case: horizontal-offset vertical-offset color, each separated by a space).

More on Suggestions

Each Style Cell has its own set of possible inputs, so every cell will only show valid CSS values.

Usually, the suggestion text matches the CSS code exactly. However, there are some exceptions to this.

In some cases, there are multiple ways to define values and the suggestions will reflect this, helping you to learn valid CSS syntax.

For example, the Margin property can be set by typing one value to set the margin for all sides, two values to set the margin for top/bottom and left/right margins, or four values to set each side margin individually. The suggestion looks like this:

In other cases, the CSS values will be more abstract than what the words imply. For example, the Flex property is a short-hand way of defining three properties: Flex Grow, Flex Shrink, and Flex Basis.