Skip to content

Icon design guidelines

Create icons that feel native to TYPO3. These shared grids, sizes, colors and construction rules keep contributions consistent with the icons already used throughout the backend.

Sizes

Size Rendered
default Scales with font-size
small 16px
medium 32px
large 48px
mega 64px

Colors

Explore the guidelines

  • Usage — choose between installation, backend usage and external usage.
  • Drawing an icon — the construction rules for action and overlay icons.
  • Module icons — the larger canvas the module menu is drawn on.
  • Bidirectional support — logical naming, and what flips in a right-to-left interface.
  • Contributing — choosing a contribution path, preparing changes and understanding the review process.