---
url: "/ko/weblify/inspect/preview.md"
description: "Weblify의 Preview 탭에서 생성된 웹사이트가 다양한 뷰포트 크기에서 어떻게 보이는지 확인하세요."
---

# 생성된 웹사이트 코드 미리보기

> Weblify의 Preview 탭에서 생성된 웹사이트가 다양한 뷰포트 크기에서 어떻게 보이는지 확인하세요.

[Video](/assets/videos/weblify/inspect/preview-code.mp4)

**Preview** 탭을 열면 현재 Weblify 웹사이트를 HTML과 CSS로 렌더링해요. 패널 위쪽의 페이지 메뉴에서 미리 볼 페이지를 고르세요. **Add**나 **Style**로 돌아가 변경한 다음, 다시 **Preview**를 열어 바뀐 결과를 확인할 수 있어요. 미리보기를 새로 고치려면 **↻** 를 선택하세요.

## 미리보기 뷰포트 너비 변경 {#changing-the-preview-viewport-width}

미리 정해진 너비로 보려면 **Desktop**, **Tablet**, **Mobile** 중 하나를, 플러그인 패널 너비에 맞추려면 **Fit**을 선택하세요. Weblify는 선택한 설정을 기억해요. 패널보다 넓은 미리보기는 패널에 맞게 축소돼요.