Pulse Animation

쉬움

규칙적으로 크기가 변하는 펄스 애니메이션

#animation#pulse#continuous

라이브 데모

💫

코드

PulseAnimation.tsx

export const PulseAnimation = () => {
  return (
    <div className="pulse-animation visible">
      <div className="pulse-circle">💫</div>
    </div>
  );
};

animations.css

.pulse-circle {
  animation: pulse 1.5s ease-in-out infinite;
}

@keyframes pulse {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.1); }
}