Hello, Any idea what would be the easiest way to achieve a gradient shadow under a tab on hover? Something similar to the image below. Thanks in advance! [hover] Here is my public share link: LINK ( how to access public share link )

For this you should add a separate DIV and style it with gradient, add a blur filter and place it behind that content block by applying absolute positioning and negative z-index. Place all the content on another DIV and apply background white on it.

Gradient shadow on hover

Design help Animations & Interactions

abirana (Abi Rana | Creative Web Developer) May 19, 2022, 3:45pm 3

There is many examples you can find on CodePen

One example you should check is https://codepen.io/DmitryTravnikov/pen/ZoMyxK?editors=1100

Topic		Replies	Views
How to make the gradient smooth? (Hover effect) General	5	3363	April 30, 2018
How to do a hover-invert effect such as this? Animations & Interactions	5	1801	May 15, 2023
Gradient Transition on Hover Animations & Interactions	1	1252	July 17, 2020
How to add a shadow on click interaction General	0	189	October 9, 2023
Button Hover Effect from Fubiz Animations & Interactions	7	1742	February 8, 2019

Gradient shadow on hover

Related topics