Codex Design vs Lovable 비교.
Lovable과 Codex Design은 둘 다 대화를 인터페이스로 바꿔 주지만 하는 일이 다릅니다. Lovable은 백엔드까지 갖춘 완전한 웹 앱을 만들고, 호스팅하고, 운영합니다. Codex Design은 Codex가 내 프로젝트에 구현하기 전에 화면을 탐색하고 다듬는 Codex용 디자인 캔버스입니다.
2026년 11월 6일 업데이트 · 6분 분량
짧게 답하자면
개발 환경을 갖추지 않고도 데이터베이스와 로그인이 있는 라이브 웹 앱이 필요하다면 Lovable이 더 좋은 도구입니다. Codex로 개발하면서 구현하기 전에 디자인을 제대로 잡고 싶다면 Codex Design이 더 맞습니다. 두 도구는 보이는 것보다 겹치는 부분이 적습니다. Lovable은 호스팅을 포함한 앱 빌더이고, Codex Design은 Codex 워크플로의 디자인 단계입니다.
- Lovable을 고르세요. 풀스택 앱을 빠르게 온라인에 올리고 싶고, 코드베이스나 호스팅을 직접 관리하고 싶지 않거나, 변경 사항을 직접 만들어야 하는 비개발자와 함께 일한다면.
- Codex Design을 고르세요. 이미 Codex를 쓰고, 여러 디자인 방향을 나란히 비교하고 싶고, 스택과 호스팅을 직접 고르고 싶다면.
각 도구는 무엇인가
Lovable은 스스로를 웹 애플리케이션을 만들고, 반복 개선하고, 배포하는 풀스택 AI 개발 플랫폼이라고 설명합니다. 채팅하면 프런트엔드, 백엔드, 데이터베이스, 인증, 연동이 갖춰진 앱을 만들어 줍니다. 새 프로젝트는 TanStack Start를 쓰며, 데이터베이스는 Lovable 내장 백엔드나 Supabase를 통한 PostgreSQL입니다. 어느 플랜에서든 lovable.app 주소로 게시할 수 있고, 코드를 GitHub 저장소와 동기화할 수 있으며, 프리뷰에서 요소를 짚어 변경 사항을 설명할 수 있습니다.
Codex Design은 저희가 만든 Codex용 독립 플러그인입니다. Codex가 디자인한 화면을 라이브 HTML 페이지로, 목업 이미지와 레퍼런스 옆에 놓아 주는 로컬 캔버스를 더해 줍니다. 요소를 선택해 사이드바에서 폰트, 색상, 간격을 바꾸거나, Codex에 요청해 계속 다듬을 수 있습니다. 캔버스 프로젝트는 내 컴퓨터에 저장됩니다.
나란히 비교
| Lovable | Codex Design | |
|---|---|---|
| 만드는 것 | 백엔드, 데이터베이스, 로그인을 갖춘 풀스택 웹 앱과 웹사이트 | 라이브 HTML 페이지로 된 웹사이트·앱 목업, 그리고 목업 이미지 |
| 실행 위치 | lovable.dev. 앱은 lovable.app 또는 내 도메인에 호스팅 | Codex 안에서 실행되며 캔버스는 내 컴퓨터에 있음(macOS, Linux) |
| 결과물과 코드 | TanStack Start 앱(이전 프로젝트는 React와 Vite), PostgreSQL. 모든 플랜에서 Git 동기화, 유료 플랜에서 .zip 다운로드 | 로컬 프로젝트의 HTML 페이지와 이미지. 이후 Codex가 선택한 디자인을 내 코드로 구현 |
| 요금 | 하루 5크레딧(월 최대 30크레딧)의 무료 플랜. Pro는 100크레딧에 월 $25부터, 연간 결제 시 월 $21 | 캔버스 프로젝트 1개는 무료, Pro는 월 $5로 프로젝트 무제한. Codex 사용량은 별도 |
| 이럴 때 적합 | 개발 환경 설정 없이 작동하는 웹 앱을 온라인에 올리고 싶을 때 | 만들기 전에 UI 방향을 비교하고 다듬고 싶은 Codex 사용자 |
Lovable의 Business 플랜은 월 $50부터 시작하며, 크레딧은 앱 안의 호스팅과 AI 기능 비용으로도 쓰입니다. 이 비교는 2026년 11월 6일 기준 두 제품의 공식 사이트와 문서를 반영했습니다.
Lovable을 고르는 경우
다음과 같은 경우에는 Lovable이 더 낫습니다.
- 화면 하나가 아니라 제품 전체가 필요하다. Lovable은 프런트엔드, 백엔드, 데이터베이스, 인증을 함께 구성해 주므로, 프로토타입이 실제 데이터를 저장하고 실제 사용자를 받을 수 있습니다.
- 호스팅을 직접 관리하고 싶지 않다. 게시하면 Lovable이 프로젝트를 자체 URL에 배포합니다. lovable.app 주소로의 게시는 모든 플랜에서 무료이고, 유료 플랜에서는 커스텀 도메인을 쓸 수 있습니다.
- 비개발자가 변경한다. 팀원이 코드를 건드리지 않고도 프리뷰에서 요소를 선택해 변경 사항을 설명하거나 텍스트를 그 자리에서 수정할 수 있습니다.
- 팀이 커지고 있다. Lovable은 시트가 아니라 크레딧으로 가격을 매기며, 모든 플랜에서 워크스페이스 구성원 수에 제한이 없습니다.
- 그래도 코드는 가지고 싶다. Git 동기화는 어느 플랜에서든 저장소를 프로젝트와 맞춰 주고, 유료 플랜에서는 프로젝트 전체를 .zip으로 내려받을 수 있습니다.
Codex Design을 고르는 경우
- 디자인하는 중이고 아직 배포 단계가 아니다. Codex Design은 누군가 하나를 확정하기 전에 여러 방향을 한 캔버스에 나란히 놓고, 레퍼런스와 Codex가 생성한 목업 이미지 옆에서 비교하도록 만들어졌습니다.
- 스택을 직접 고르고 싶다. Lovable은 모든 프로젝트의 프레임워크와 데이터베이스를 정해 줍니다. Codex는 기존 저장소에서 작업하므로, 고른 디자인을 이미 쓰는 도구로 구현할 수 있습니다.
- 직접 시각적으로 수정하고 싶다. HTML 목업에서 요소를 선택하고 사이드바에서 폰트, 색상, 간격 등의 속성을 바꾸세요.
- 작업물을 내 컴퓨터에 두고 싶다. 캔버스 프로젝트는 로컬에 저장됩니다. 다만 Codex에 공유한 컨텍스트는 Codex가 처리합니다.
- 캔버스 요금이 정액이었으면 한다. Codex Design에는 크레딧 잔액이 없습니다. 캔버스 프로젝트 1개는 무료이고 Pro는 월 $5로 프로젝트 무제한입니다. Codex 사용량은 Codex 플랜에서 차감됩니다.
자주 묻는 질문
Codex Design은 Lovable의 대안인가요?
Lovable이 하는 일의 일부에 한해서입니다. Codex Design은 Codex에서 화면을 탐색하고, 비교하고, 다듬는 디자인 단계를 맡습니다. 앱을 호스팅하거나 백엔드를 추가하거나 데이터베이스를 관리하지는 않습니다. 자체 개발 환경 없이 호스팅되는 풀스택 앱이 필요하다면 Lovable이 더 좋은 선택입니다.
나중에 Lovable에서 Codex로 옮길 수 있나요?
Lovable의 Git 동기화는 어느 플랜에서든 프로젝트를 저장소에 넣어 주고, 유료 플랜에서는 코드를 .zip으로 내려받을 수도 있습니다. 코드가 저장소에 들어가면 Codex가 다른 프로젝트처럼 작업할 수 있습니다.
Codex Design이 Codex가 만든 앱을 호스팅하나요?
아니요. Codex Design은 로컬 디자인 캔버스이지 호스팅 서비스가 아닙니다. Codex가 만든 결과를 어떻게 배포할지는 각자의 환경에 달려 있습니다.