인터랙션과 애니메이션 추가하기

Basic25기본 사용법

Framer의 인터랙션 기능으로 호버, 클릭, 스크롤 애니메이션을 코딩 없이 구현합니다.

STEP 1 / 3
1

STEP 1. Hover 인터랙션 추가

framer.com
Framer
AI로 웹사이트를 만드세요
코드 없이 전문적인 웹사이트를 빠르게 완성
AI로 생성
여기를 클릭!
템플릿 시작
포트폴리오
비즈니스
SaaS 랜딩
에이전시

요소 선택 → Interactions 탭 → Hover → 변화 설정 → 미리보기

요소를 선택하고 오른쪽 패널 'Interactions' 탭을 클릭합니다. '+ Add Interaction' → 'Hover' → 원하는 변화(크기, 색상, 위치)를 설정합니다.

Transition 설정으로 인터랙션 속도와 가속도를 세밀하게 조정할 수 있어요.

이 단계를 완료했나요?