# Hover

**Path:** CSS Framework/Utilities

[Back to Documentation Index](http://rubicblazor.skyconis.com/docs.md)

---

Hover

 Hover utilities provide pointer feedback for interactive surfaces without changing their content color.

 Pointer Follow Hover

 Add .hover-follow to apply a pointer-follow hover layer. The layer darkens light
 backgrounds and lightens dark backgrounds. Combine it with .ripple and
 .clickable when click feedback and a pointer cursor are also required.

 Light solid background

 Dark solid background

 Palette background

 Existing gradient background

 Nested Targets

 Nested hover targets switch independently. Move the pointer from the row to an action button,
 then back to the row to verify that the parent hover is restored.

 Nested hover row 
 Move between this area and the actions.

 Delete

 Move

 Scrollable Ancestors

 The hover layer is clipped by scrollable ancestors and remains inside their visible area.

 Scroll horizontally and vertically while hovering this surface.

 Layering

 Open the popover, then hover the uncovered part of the large surface. Its hover layer must
 remain below the popover. Hover effects inside the popover must remain visible.

 Open Layer Test 

 Background hover target

 ✕

 Contents