---
title: "direction-reveal"
description: "Detects which edge the cursor entered or left an element from and reveals overlay content from that direction."
canonical: "https://vibing.inc/library/direction-reveal-vg-0152"
category: "Backgrounds, Effects & CSS Oddities"
subcategory: "Hover effects"
license: "MIT"
author: "Nigel O'Toole (@NigelOToole)"
source: "https://github.com/NigelOToole/direction-reveal"
---

# direction-reveal
Detects which edge the cursor entered or left an element from and reveals overlay content from that direction.
## Facts
- Source: https://github.com/NigelOToole/direction-reveal
- Category: Backgrounds, Effects & CSS Oddities / Hover effects
- Author: Nigel O'Toole (@NigelOToole)
- Licence: MIT
- Tags: hover, reveal, css, vanilla-js
## Why it's a gem
Direction-aware reveals read as expensive but are a few lines of geometry
---
Listed in The Vibeary: https://vibing.inc/library/direction-reveal-vg-0152 · JSON: https://vibing.inc/api/public/library/gems/direction-reveal-vg-0152