Eyes that follow
Pupils follow the pointer anywhere on the page, at most 22px from center.
Move your pointer anywhere on the pageEdit
.eyes {
display: flex;
gap: 18px;
justify-content: center;
align-items: center;
height: 100%;
}
.eyes__eye {
display: grid;
place-items: center;
width: 100px;
height: 100px;
border-radius: 50%;
background: #fff;
box-shadow: inset 0 -6px 0 rgb(0 0 0 / 0.07), 0 12px 30px -12px rgb(12 19 36 / 0.35);
}
.eyes__pupil {
--k-follow: 1;
--k-limit: 22px;
--k-area: viewport;
--k-motion: snappy;
display: block;
width: 38px;
height: 38px;
border-radius: 50%;
background: #0c1324;
}