Using the Style System

Adobe Experience Manager’s Style System allows visual variations of components without back-end development, allowing better re-use of AEM components, and more versatile and efficient content authoring. The Style System, when used in conjunction with AEM Core Components, template editor, and responsive layout, offers powerful capabilities to quickly compose rich experiences.

This video demonstrates how the Style System can be leveraged to create dramatically different visual appearances for a single Component, using only CSS.

The styles shown are provided by the WKND application. These styles are defined as CSS and do not require changes to the component’s backend logic, the HTL script or Sling Model.

Additional Resources

Want to learn how to develop with the Style System? Checkout the following tutorials:

On this page

Adobe Maker Awards Banner

Time to shine!

Apply now for the 2021 Adobe Experience Maker Awards.

Apply now
Adobe Maker Awards Banner

Time to shine!

Apply now for the 2021 Adobe Experience Maker Awards.

Apply now