# Sparkles

Sparkles are the last layer of the legendary show and the quietest. Sixteen diamonds sit in a loose ring around the card and glint one after another, never in the same order twice.

> Live preview: see it play at https://bettertyped.github.io/react-cards-opening/docs/effects/sparkles/
>
> Press the card and look just outside its corners.

## When it plays

Only tiers whose `effect` is `legendary` get it, and nobody with reduced motion.

## How it is built

Each diamond is a 12 pixel square turned 45 degrees, in the tier's colour mixed with white, with a 12 pixel glow. They are placed by angle around the card, a little further out on some than others.

One loop drives all sixteen: scale and fade in over a quarter of a second, out over half, each starting 0.12 seconds after another picked at random.

## What changes it

- They belong to tiers whose `effect` is `legendary`, and are skipped with reduced motion.

## Related

- [Shine](https://bettertyped.github.io/react-cards-opening/docs/effects/shine/)
- [Beam and lock](https://bettertyped.github.io/react-cards-opening/docs/effects/beam-and-lock/)
- [Hum](https://bettertyped.github.io/react-cards-opening/docs/effects/hum/)
- [Effects](https://bettertyped.github.io/react-cards-opening/docs/effects/)
- [Rarity tiers](https://bettertyped.github.io/react-cards-opening/docs/rarity-tiers/)

Source: https://bettertyped.github.io/react-cards-opening/docs/effects/sparkles/