dot/matrix← all loaders
BracketsFour corner brackets light in turn, sweeping clockwise.
43spinner

Brackets

Four corner brackets light in turn, sweeping clockwise.

slug
icon-43
duration
2000ms
iteration
infinite
lit cells
12 / 25
size
2.45 KB
easing
cubic-bezier(0.25, 1, 0.5, 1)

used at typical sizes

BracketsFour corner brackets light in turn, sweeping clockwise.
16px
BracketsFour corner brackets light in turn, sweeping clockwise.
24px
BracketsFour corner brackets light in turn, sweeping clockwise.
32px
BracketsFour corner brackets light in turn, sweeping clockwise.
48px
BracketsFour corner brackets light in turn, sweeping clockwise.
72px

react

tsx
<DotMatrixIcon iconIndex={42} size={48} />

standalone svg

svg
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 56 56" role="img" aria-label="Brackets"><title>Brackets</title><desc>Four corner brackets light in turn, sweeping clockwise.</desc><style>.bg{fill:#ffffff;opacity:0.07;}.lit{fill:#ffffff;opacity:0;animation:icon-43-kf 2000ms cubic-bezier(0.25, 1, 0.5, 1) infinite both;}@keyframes icon-43-kf {0%{opacity:0;}8%{opacity:1;}36%{opacity:0.05;}100%{opacity:0;}}@media (prefers-reduced-motion: reduce){.lit{animation:none;opacity:0.45;}}.d00{animation-delay:0ms;}.d01{animation-delay:0ms;}.d03{animation-delay:500ms;}.d04{animation-delay:500ms;}.d10{animation-delay:0ms;}.d14{animation-delay:500ms;}.d30{animation-delay:1500ms;}.d34{animation-delay:1000ms;}.d40{animation-delay:1500ms;}.d41{animation-delay:1500ms;}.d43{animation-delay:1000ms;}.d44{animation-delay:1000ms;}</style><circle class="bg" cx="6" cy="6" r="2.4"/><circle class="bg" cx="17" cy="6" r="2.4"/><circle class="bg" cx="28" cy="6" r="2.4"/><circle class="bg" cx="39" cy="6" r="2.4"/><circle class="bg" cx="50" cy="6" r="2.4"/><circle class="bg" cx="6" cy="17" r="2.4"/><circle class="bg" cx="17" cy="17" r="2.4"/><circle class="bg" cx="28" cy="17" r="2.4"/><circle class="bg" cx="39" cy="17" r="2.4"/><circle class="bg" cx="50" cy="17" r="2.4"/><circle class="bg" cx="6" cy="28" r="2.4"/><circle class="bg" cx="17" cy="28" r="2.4"/><circle class="bg" cx="28" cy="28" r="2.4"/><circle class="bg" cx="39" cy="28" r="2.4"/><circle class="bg" cx="50" cy="28" r="2.4"/><circle class="bg" cx="6" cy="39" r="2.4"/><circle class="bg" cx="17" cy="39" r="2.4"/><circle class="bg" cx="28" cy="39" r="2.4"/><circle class="bg" cx="39" cy="39" r="2.4"/><circle class="bg" cx="50" cy="39" r="2.4"/><circle class="bg" cx="6" cy="50" r="2.4"/><circle class="bg" cx="17" cy="50" r="2.4"/><circle class="bg" cx="28" cy="50" r="2.4"/><circle class="bg" cx="39" cy="50" r="2.4"/><circle class="bg" cx="50" cy="50" r="2.4"/><circle class="lit d00" cx="6" cy="6" r="3.1"/><circle class="lit d01" cx="17" cy="6" r="3.1"/><circle class="lit d03" cx="39" cy="6" r="3.1"/><circle class="lit d04" cx="50" cy="6" r="3.1"/><circle class="lit d10" cx="6" cy="17" r="3.1"/><circle class="lit d14" cx="50" cy="17" r="3.1"/><circle class="lit d30" cx="6" cy="39" r="3.1"/><circle class="lit d34" cx="50" cy="39" r="3.1"/><circle class="lit d40" cx="6" cy="50" r="3.1"/><circle class="lit d41" cx="17" cy="50" r="3.1"/><circle class="lit d43" cx="39" cy="50" r="3.1"/><circle class="lit d44" cx="50" cy="50" r="3.1"/></svg>