Box over image
Text box overlapping the image in multiple positions. Ideal for highlighting a benefit, feature, or key message with a large image and minimal text. Alternate image positions across modules for stronger visual impact and a sense of discovery while scrolling.
Live Preview| Use case | Overlays a text box on your image in multiple positions. |
| Page speed impact | Low when lazy loading is enabled and the module is not above the fold, unless heavy resources are added. May be Medium above the fold on mobile, depending on image size and optimization. Use TinyPNG or SVGs to keep images lightweight. |
| Available in pages | Yes |
| Reserved block class | box-over-image |
| Relevant files | css/components/box-over-image.css |