Area Classes

Play with classes on Areas to create unique content style

Customize Areas through classes

• Concrete5 introduces custom classes for blocks and Areas. This is great news for designers who can now create skins for it.
• Supermint offers classes of colors, spacing and topics for Areas. The three categories can be mixed between them, so you can add a class for color, one for spacing and finally a topic if necessary. Understand quickly by looking at the following examples.

Color classes

There are eight classes available for Area:

1. area-primary
2. area-secondary
3. area-tertiary
4. area-quaternary
5. page-content-style : Take the design of page content (here white with a small grey border)
6. area-white
7. area-black
8. area-body : Take the pattern and color of the body

Other classes

Take color defined in the color customization .

Spacing classes

Four classes are available to add padding into an Area:

1. small: area-space-s
2. medium: area-space-m
3. large: area-space-l
4. extra large: area-space-xl

Topics classes

Six classes are available to add topics into an Area :

1. topic-get-in-touch
2. topic-idea
3. topic-help
4. topic-config
5. topic-news
6. topic-conversation

Below topics classes are applied with both space-s class and a secondary or tertiary color class.

---

Original reference: web.archive.org page