Skip to main content
Ambient.Impact

Main navigation

  • Web dev
    • Snippets
    • Essays
    • Components
    • Resources
    • Tags
  • Portfolio
  • Gaming
    • Linux
    • Specs
    • About
    • Elite Dangerous
  • About
  • Contact

Breadcrumb

  1. Web development
  2. Snippets

Inline link styles

The user hovers their pointer over a link and the underline expands upwards to fill the entire link's background.
Play this animated GIF
The user hovers their pointer over a link and a box appears from the left edge, covering the entire link's background.
Play this animated GIF
The user hovers their pointer over a link and a box briefly zooms in, but fades out as it does so. The reverse happens on the pointer leaving the link.
Play this animated GIF
The user hovers their pointer over a link and a box expands from the background of the link, resting above it, with the URL that the link points to.
Play this animated GIF
The user hovers their pointer over a link and the link text slides to the left, revealing an arrow pointing right.
Play this animated GIF
The user hovers their pointer over a link and square braces fade in and move in from both the left and right of the link.
Play this animated GIF
The user hovers their pointer over a link and an irregular line is drawn from left to right under the link.
Play this animated GIF
Source link
https://tympanus.net/Development/InlineAnchorStyles/
Tags
CSS
Design inspiration
Clever things
  1. Find me on GitLab
  2. Find me on GitHub
  3. Find me on Drupal.org
  4. Find me on Mastodon
  5. Find me on Steam
  6. Find me on YouTube