Feature Section Victor

overview

Low-contrast cards that reveal a background image on hover.

Feature Section Victor
Available for:
Figma
Bricks
Gutenberg
Buy Frames
Back to library

Overview

Low-contrast cards that reveal a background image on hover. Background fades and scales. Can be used to feature services, people, products, blog posts, etc.

The image is an actual image, not a background image, so users can take advantage of alt tags, SRCSET, lazy loading, and additional animation possibilities.

Users can easily dial in the hover opacity of the image, scale amount, transition duration, timing function, etc., with locally scoped variables.

Query Loop Compatible

Frame Created on December 16, 2023

Frame Last Updated on December 16, 2023

Variables

This frame uses the following locally scoped variables to make it easier for you to edit the style or behavior of this frame. Variables can be viewed or edited from the CSS tab.
--start-opacity
--end-opacity
--start-scale
--end-scale
--transition-duration
--transition-function
--focus-color

Accessibility Notes

The cards use clickable parent and focus parent for maximum accessibility.

This frame uses the clickable parent technique.

FAQs

Use the related frames section above to check FAQs for other frames related to this frame if you don't see your question here.