---
url: "/ko/bannerify/design/gif.md"
description: "배너 디자인에 GIF를 사용하는 방법은 두 가지가 있어요. 디자인에 GIF를 어떻게 넣고 싶은지에 따라 각각 조금씩 다르게 작동해요."
---

# HTML 배너에 애니메이션 GIF 넣기

> 배너 디자인에 GIF를 사용하는 방법은 두 가지가 있어요. 디자인에 GIF를 어떻게 넣고 싶은지에 따라 각각 조금씩 다르게 작동해요.

> **Note:** GIF 레이어는 메인 타임라인에 포함되어 있어야 해요. ***중첩된* 레이어 안의 GIF는 렌더링되지 않으며** HTML 내보내기에도 포함되지 않아요. 삽입된 애니메이션 GIF는 Bannerify의 **GIF/동영상 내보내기에도 포함되지 않아요**.

> **Tip:** **투명 GIF 지정하기**. 기본적으로 GIF 내보내기에는 투명도가 포함되지 않아요. GIF에 투명도가 필요하다면 Figma 레이어 이름 아무 곳에나 **transparent**라는 단어를 넣으세요.

## 애니메이션 GIF를 이미지 레이어로 사용하기 {#using-animated-gifs-as-image-layers}

[Video](/assets/videos/bannerify/design/animated-gif-layer.mp4)

`.gif` 파일을 최상위 배너 안으로 드래그하면 Figma 이미지 레이어로 추가돼요.

이 방법으로는 애니메이션 GIF 위에 다른 콘텐츠를 올릴 수 없어요. 다만 이 프레임에 있는 추가 Figma 채우기(예: 색상/그라디언트 오버레이)는 최종 `.gif` 내보내기에 함께 포함돼요.

## 애니메이션 GIF를 프레임 레이어의 배경 채우기로 사용하기 {#using-animated-gifs-as-background-fills-on-a-frame-layer}

[Video](/assets/videos/bannerify/design/animated-gif-fill.mp4)

또는 컴퓨터에 있는 `.gif` 파일을 프레임 레이어의 **채우기**로 드래그해 프레임 배경의 이미지 채우기로 설정할 수도 있어요. 이 프레임에 있는 추가 Figma 채우기(예: 색상/그라디언트 오버레이)도 최종 `.gif` 내보내기에 함께 포함돼요.

이 방법의 장점은 프레임 안에서 애니메이션 GIF 위에 다른 Figma 레이어(텍스트, 이미지 등)를 추가할 수 있고, 그 레이어도 HTML 배너와 함께 내보내지는 `.gif`에 포함된다는 점이에요.
