Skip to content

Components / Thumbnail


Thumbnails are small images, similar to avatars, used inline with text in lists, paragraphs, or just about any layout component.


Thumbnails are often used to compliment some other content. Refer to the content component guidelines for additional spacing and layout considerations.




The size enforces a square container using one of several preset sizes.

Size Description
Extra small 24 px
Small 36 px
Medium 48 px
Large 72 px
Extra large 96 px
When two or more thumbnails are placed next to each other, ensure spacing is applied to separate them slightly more than a typical inline block element.


Style specifications are available to inspect via Abstract. The following link will take you to their web-based interface.

Inspect component

© 2020 Jack Henry & Associates, Inc. Trademark notice
Version 2.0.0-beta.5.1. Last updated December 16, 2020.