Product section

Create colored section to show different categories or offers similar to the online shop.

Overall styling#

  • The background of a section can be any desired color.
  • It is always the full width and the height depends on the displayed content.

Spacing & measurements#

TypesAttributesPreview
Padding-top/-bottom8pxpadding

Our workflow in Sketch#

  • Just place a rectangle on the artboard with the right width, height and padding.

Change log#

1.3.0 Mail - 2022-02-21#

Changed#

  • Doc: "Section" | Updated documentation preview assets with new star rating

1.1.0 Mail - 2021-07-22#

Changed#

  • Doc: "Section" | Cleaned up the documentation for the right structure and sentence case

1.0.0 Mail - 2021-06-24#

Changed#

  • Doc: "Section" | Updated previews in documentation