A naming convention for UI components

The CEV pattern

An example of component name with CEV naming convention (Article Card Large, respectively Context, Element and Variant).
An example of a component name with the CEV naming convention.

Context

Element

Variant (optional)

Examples

Order

Exceptions and Restrictions

Context omitted

Singular and Plural

Multi-word tokens

Conclusion

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store