6XC

HTML/CSS/JS 실시간 에디터

브라우저 안의 작은 놀이터 — HTML, CSS, JS를 작성하면 샌드박스 미리보기에 실시간으로 반영됩니다. 계정이나 빌드 과정 없이.

조회수 889회

미리보기

설정이 필요 없는 놀이터

HTML, CSS, JS 탭에 입력하면 아래 미리보기가 입력과 동시에 업데이트됩니다 — 모든 과정이 브라우저 안에서만 실행되며, 이 페이지나 사용자 데이터에 접근할 수 없는 샌드박스 처리된 iframe 안에서 동작합니다. 코드 조각을 테스트하거나, 컴포넌트를 프로토타입하거나, 실제 프로젝트에 넣기 전에 CSS가 어떻게 보이는지 확인할 때 유용합니다.

이 도구는 의도적으로 일반 텍스트 편집(구문 강조 없음) 방식을 사용합니다 — 도구를 가볍고 외부 에디터 라이브러리에 의존하지 않게 유지하기 위해서입니다.

자주 묻는 질문

제 코드가 어딘가로 전송되나요?

아니요 — 모든 것이 브라우저에서 로컬로 실행됩니다. 미리보기는 같은 페이지의 샌드박스 iframe에서 렌더링되며, 서버에 업로드되거나 저장되는 것은 없습니다.

왜 구문 강조 기능이 없나요?

진짜 코드 에디터(구문 강조, 자동완성)를 추가하려면 무거운 외부 에디터 라이브러리를 불러와야 합니다. 이 도구는 일부러 가볍게 유지됩니다 — 단순한 텍스트 영역, 즉시 로딩, 의존성 제로.

미리보기에서 신뢰할 수 없는 코드를 실행해도 안전한가요?

미리보기 iframe은 allow-same-origin 없이 sandbox="allow-scripts"만 사용하므로, 내부 스크립트는 이 페이지의 쿠키, 로컬 저장소 등 어떤 것도 읽을 수 없습니다 — 신뢰할 수 없는 임베드와 동일한 방식으로 격리됩니다.

비슷한 도구

JSON 포맷터 무료 온라인 JSON 유효성 검사기, 정렬(예쁘게 출력) 및 압축(minify) 도구입니다. 사용하기 내 IP 주소 확인 공인 IPv4/IPv6 주소, 인터넷 제공업체, 대략적인 위치, 브라우저 정보를 즉시 확인하세요 — 클릭 한 번으로 복사할 수 있습니다. 사용하기 색상 변환기 HEX, RGB, HSL 색상 코드를 즉시 상호 변환합니다. 색상 선택기 포함, 무료. 변환하기 진법 변환기 숫자를 2진수, 8진수, 10진수, 16진수, 그리고 2부터 36까지의 임의의 진법으로 변환합니다 — 아무리 큰 값이라도 정확합니다. 변환하기