geist mono

geist mono

Search…

Random rotate

Add some playfulness to your hover effects.

Random rotate

Add some playfulness to your hover effects.

About

Store

Projects

Chat

Head to the desktop site to copy.

Updated:

Nov 8, 2023

Type:

Override

Notes

  • In the above examples, '21' refers to the range of integers that it will select from. By default this is 0–20 so we subtract 10 to shift the range to between -10 and 10.

  • If you want a more consistent effect you could edit the random calculation (see below snippet) to exclude numbers between -2 and 2 (where it's hard to perceive the rotation).

 const randomRotation = () => {
            let value = 0
            do {
                value = Math.floor(Math.random() * 21) - 10
            } while (value >= -2 && value <= 2)
            return value
        }

Help

How do I add code overrides?