TL;DR

HTML Anything는 로컬 코딩-agent CLI를 재사용해 마크다운·표·JSON 같은 원본을 즉시 ‘배포 가능한’ 단일 HTML로 변환하는 로컬-퍼스트 에디터입니다. PATH에서 CLI를 자동 탐지하고 각 에이전트의 JSON-line 출력을 SSE로 스트리밍해 iframe에 실시간 렌더링하며, 결과물은 juice inlining과 modern-screenshot 파이프라인으로 WeChat·X·Zhihu·PNG로 바로 내보낼 수 있습니다. 사용 전제는 로컬에 지원되는 코딩-agent CLI(예: claude, cursor, gemini 등)를 설치·로그인해 두는 것이며 템플릿 라이브러리(75 skills)와 보안 미들웨어가 이미 성숙한 상태입니다.

핵심 포인트

• HTML Anything는 로컬에 설치한 코딩-agent CLI를 감지해 해당 CLI를 spawn하고 JSON-line 출력을 SSE로 스트리밍해 클라이언트의 iframe srcdoc를 실시간으로 갱신하는 에이전트형 HTML 편집기입니다. 에디터는 PATH에 있는 여러 CLI(Claude Code, Cursor, Codex, Gemini, Copilot 등)를 어댑터로 연결하고 기존 터미널 세션을 재사용해 별도 API 키가 필요하지 않은 워크플로우를 제공합니다. 이 방식은 작성물(마크다운·CSV·JSON 등)을 에이전트가 직접 “ship-ready” 단일 HTML로 변환하고 즉시 WeChat/X/Zhihu/PNG로 내보낼 수 있게 해 생산성과 배포 비용을 동시에 낮춥니다.
• 템플릿 생태계는 75개의 skill 템플릿과 9개 표면(surface)을 중심으로 구성되어 있으며 각 skill은 SKILL.md, assets, example.html 규약을 따르는 폴더 단위입니다. 사용자는 피커에서 모드(프로토타입·덱·프레임·소셜·오피스 등)와 시나리오(디자인·마케팅·엔지니어링 등)를 선택해 즉시 예제 HTML을 열어 결과물을 확인할 수 있습니다. 템플릿의 하드 제약(CJK-first 폰트 스택, 8px baseline, contrast ≥ 4.5, 실제 데이터 사용 의무)은 모델이 시각적으로 일관된 결과물을 내도록 설계 품질을 지탱합니다.
• 보안과 로컬 우선성에 초점을 맞춘 설계가 적용되어 있습니다. 생성 결과는 sandboxed iframe(allow-scripts, allow-same-origin)에서 격리 실행되고 Next API는 Host-header 허용 목록과 미들웨어로 로컬 접근만 허용하는 기본 정책을 사용해 외부 페이지의 악성 요청을 방지합니다. 또한 에이전트 프로세스와의 통신은 로컬에서 spawn된 CLI로 한정되어 API 키나 외부 서버에 자격증명을 노출하지 않는 운영 모델을 유지합니다.
• 내보내기 파이프라인은 플랫폼별 최종 형식에 맞춘 자동화가 잘 갖춰져 있습니다. juice로 CSS를 인라인해 WeChat과 Zhihu에 바로 붙여넣을 수 있고 modern-screenshot으로 2× PNG를 만들어 X·Weibo·Xiaohongshu에 클립보드로 붙여넣는 흐름을 제공합니다. 이 자동화 덕분에 생성물에 대해 수동으로 포맷을 손보는 ‘두 번째 작업’이 거의 필요하지 않으며 배포 속도가 크게 개선됩니다.

이미지 분석