인증, 대시보드, 파일 업로드, 결제, 알림, AI 등 자주 만드는 기능에 바로 복사해 쓰는 프롬프트 모음입니다.
프롬프트 라이브러리
사람들이 가장 많이 만드는 기능을 위한 복붙용 프롬프트입니다. 인증, 대시보드, 파일 업로드, 결제, 알림, AI를 모두 기본 제공 백엔드(Cloud) 위에서 구현합니다.
가장 자주 만드는 기능에 바로 쓸 수 있는 프롬프트입니다. 모든 프롬프트는 Lovable에서 채팅 메시지 하나로 동작하며, 기능에 백엔드가 필요하면 기본 제공 백엔드(Cloud)를 사용합니다. 프롬프트에 별도 언급이 없는 한 설정할 API 키나 외부 서비스는 없습니다.
이 라이브러리를 쓰는 방법은 다음과 같습니다.
- 이름, 숫자, 예시는 각자의 것으로 바꾸세요. 가격, 파일 용량 제한, 컬럼 이름 같은 구체적인 값은 요구 사항이 아니라 자리표시자입니다.
- 프롬프트는 한 번에 하나씩 실행하세요. 결과를 검토한 뒤 다음 기능으로 넘어가는 방식은 프롬프팅 모범 사례에서 설명합니다.
- 긴 프롬프트라면 끝에 "Ask me any questions you need before building"을 덧붙이거나, Plan mode로 접근 방식을 먼저 맞추세요.
- 디자인 방향이나 제품 컨텍스트처럼 계속 유지되어야 할 결정은 프로젝트 지식에 저장하세요. 이후 모든 프롬프트가 자동으로 그 위에서 빌드됩니다.
프롬프트는 모든 플랜에서 동작하며 아래에 표시한 두 가지가 예외입니다. 기본 제공 결제는 Pro 이상 플랜이 필요하고, 앱 이메일은 유료 플랜이 필요합니다.
디자인과 스타일
스타일 방향을 지정하는 것이 기본 UI 느낌에서 벗어나는 가장 빠른 방법이며, 새 기능을 빌드하는 중이든 스타일만 따로 바꾸든 어떤 프롬프트에서도 통합니다. 레퍼런스에서 방향을 하나 고르고, 그 키워드를 사용하고, 섹션 전반에서 일관되게 유지하세요. 한 페이지에서 여러 스타일을 섞는 방법을 포함한 기법은 프롬프팅 모범 사례에서 다룹니다. 특정 서체를 가져오려면 커스텀 폰트를, 회사 자체 컴포넌트 라이브러리 위에서 빌드하려면 디자인 시스템을 참고하세요.
가장 흔한 방향에 바로 쓸 수 있는 프롬프트입니다. 페이지나 기능 이름만 각자의 것으로 바꾸세요.
미니멀한 룩 설정하기
Design the note-taking app with radical minimalism: a pure white background, a single centered column, neutral tones, no visual clutter, and soft, quiet transitions. Remove every element that is not essential.프리미엄 글래스모피즘 룩 설정하기
Restyle the dashboard with a premium, glassmorphic look: frosted, translucent cards over a soft gradient background, layered depth with gentle shadows, a translucent navigation bar, and hover states that subtly brighten each card. Simplify the glass effects on mobile.대담한 룩 설정하기
Design the portfolio site bold and brutalist: massive headlines, a stark black-and-white palette, a strict column grid, raw typography, and oversized calls to action.게임 느낌의 경쾌한 룩 설정하기
Restyle the habit tracker with playful gamification: colorful achievement badges, animated progress rings, a streak counter, celebration moments when a goal is hit, and encouraging copy on progress bars.차분한 룩 설정하기
Design the meditation app calm and elegant: soft gradients, a muted palette, generous spacing, smooth fade-ins, and clean, centered layouts.에디토리얼 룩 설정하기
Design the blog with editorial polish: a magazine-style grid, a large featured image on each article, distinctively styled pull quotes, a serif font for body text with a sans-serif for headlines, generous line spacing, and reading time estimates. On mobile, use a single column with a comfortable reading width.디자인 선택지 탐색하기
어떤 방향으로 갈지 정하지 못했나요. Lovable이 고를 수 있는 콘셉트를 여러 개 제시할 수 있습니다. 탐색이 어떻게 동작하는지는 디자인 가이던스를 참고하세요.
Show me three options for the hero section.이미지 에셋 생성하기
Lovable은 요청하면 앱에 쓸 이미지를 생성하며, 직접 만든 이미지를 채팅에 첨부할 수도 있습니다. 이미지와 동영상 추가하기를 참고하세요.
Generate a hero image of a mountain at sunrise and use it as the hero background.다른 프로젝트의 브랜드 재사용하기
교차 프로젝트 참조에서 설명하듯 @로 다른 Lovable 프로젝트를 이름으로 참조하세요.
Use the logo and color palette from @BrandSite.계정과 접근 권한
사용자 계정 추가하기
Lovable이 기본 제공 백엔드를 자동으로 활성화하고 페이지, 연결 로직, 데이터 보호를 생성합니다. 전화번호, Apple, Microsoft, SAML SSO 같은 추가 로그인 방식은 사용자와 인증에서 다룹니다.
Add user accounts to my app. Include signup, login, and forgot password pages that match the app's existing style. Require login before accessing the dashboard. Add a "Sign in with Google" button alongside email and password. Show clear error and success states on every form.비밀번호 없는 로그인 추가하기
매직 링크와 일회용 코드는 이메일 로그인의 일부입니다.
Let users sign in with a magic link sent to their email instead of a password. Show a "Check your inbox" screen after they enter their address, and let them request a new link if it expires.역할과 권한 추가하기
Add role-based access control. Every user has a role: admin, editor, or viewer. Admins can manage users and see an admin area, editors can create and edit content, and viewers have read-only access. Hide navigation items the current role cannot use, and protect the data so a viewer cannot modify records even through direct requests.사용자 설정 페이지 추가하기
Create a settings page for logged-in users. Let them update their display name, upload a profile photo, and change their password. Show a confirmation message after each successful change and validation errors inline. Add a "Delete account" option with a confirmation dialog that explains the action is permanent.로그인 페이지 없는 사내 도구 만들기
자기 팀을 위한 앱은 로그인한 워크스페이스 멤버를 인식할 수 있어 별도 계정을 만들 필요가 없습니다. Lovable 워크스페이스 신원 재사용을 참고하세요.
Use Lovable workspace identity for this internal app instead of a separate login flow. Build a task tracker where each signed-in workspace member only sees tasks assigned to them.핵심 앱 기능
작업 보드 만들기
Build a task management app with a kanban board. Use columns for Backlog, In Progress, and Done. Tasks have a title, description, priority, and due date. Support drag and drop between columns, and store tasks per user so everyone sees only their own board. Keep the design minimal and focused, with quiet motion.대시보드 만들기
Create a finance dashboard with a premium and sleek design. Show a balance summary card, a line chart of the last 30 days, a table of recent transactions with search and filters, and quick action buttons. Use realistic sample data until real data is connected, and include loading and empty states.파일 업로드 추가하기
파일은 프로젝트의 Cloud 스토리지에 저장됩니다.
Add file uploads. Users can upload PDF and image files up to 10 MB, see a list of their uploaded files with name, size, and date, preview images inline, and delete files they own. Keep files private so users only ever see their own uploads.CSV 가져오기와 내보내기 추가하기
Add CSV import and export to the contacts table. For import, users upload a CSV, map its columns to the contact fields, preview the first rows, and confirm. Show a summary of how many rows imported and which failed, and why. For export, add a button that downloads the current filtered view as a CSV file.다크 모드 토글 추가하기
Add a dark mode toggle to the header. Respect the user's system preference by default, remember their manual choice, and make sure every page, chart, and form looks right in both themes.실시간으로 갱신되게 만들기
기본 제공 백엔드에는 realtime이 포함되어 있어, 공유 화면이 새로 고침 없이 동기화 상태를 유지할 수 있습니다.
Make the task board update live. When one user moves or edits a task, everyone else viewing the board sees the change immediately without refreshing. Show a subtle indicator of who else is currently viewing the board.재사용 가능한 컴포넌트 세트 만들기
Create a reusable component set with a premium, glassmorphism look: translucent surfaces, soft blur, and layered depth. Include a navigation bar, a feature card, a toggle switch, and a tab menu, with gentle hover and click interactions. Support light and dark mode. Use these components consistently across the app.협업
팀 워크스페이스 추가하기
Add team workspaces. A user can create a workspace, invite others by email with an invite link, and switch between workspaces. Workspace members see shared data, and each member has a role of owner, admin, or member with matching permissions. Show pending invitations and let owners revoke them.알림 추가하기
Add a notification system. Show a bell icon in the header with an unread count. Notify users in the app when someone comments on their post or mentions them. Include a notifications page with read and unread states and a "Mark all as read" action.특정 상황에 사용자에게 이메일 보내기
Email users when they are mentioned or when a task is assigned to them. Match the email design to the app's branding, include a link straight to the relevant item, and let users turn each email type on or off in their settings.활동 피드 추가하기
Add an activity feed to the workspace. Log key events (item created, updated, completed, member joined) with who did it and when. Show the feed newest first with relative timestamps, group repeated events, and let users filter by member or event type.결제
기본 제공 결제는 Pro 이상 플랜이 필요하며, Lovable이 시작한 제공자 설정은 프로젝트 또는 워크스페이스 admin과 owner만 완료할 수 있습니다. 사용 조건과 설정 방법은 앱에 결제 기능 추가하기를 참고하세요.
구독 등급 추가하기
Add payments with two subscription tiers. Free includes up to 3 projects. Pro at $12 per month includes unlimited projects and priority support. Add a pricing page comparing the tiers, show free users an upgrade prompt when they hit the limit, and add a "Manage subscription" button that opens the customer portal so subscribers can update payment details or cancel.일회성 구매 판매하기
Add a one-time purchase that unlocks the premium template pack for $29. Show a locked state with a preview and an "Unlock" button, take the user through checkout, and unlock the content immediately after a successful payment. Show purchase history on the account page.다른 서비스 연결하기
서드파티 서비스는 프롬프트에 서비스 이름을 적으면 Lovable이 연결 절차를 안내합니다. 각 커넥터 페이지에서 설정과 권한을 다루며, 전체 목록은 커넥터 카탈로그에 있습니다.
| 서비스 | 이렇게 프롬프트해 보세요 | 자세히 보기 |
|---|---|---|
| Resend | "Send a welcome email through Resend when a user signs up." | Resend |
| Twilio | "Text users an SMS confirmation when their booking is confirmed, using Twilio." | Twilio |
| Slack | "Post a message to our Slack channel when a new order comes in." | Slack |
| Google Maps | "Show our store locations on an interactive Google Map with info popups." | Google Maps |
| Calendly | "Let visitors book a call from the contact page using my Calendly." | Calendly |
| Notion | "Sync published posts to my Notion database." | Notion |
| Shopify | "Build an e-commerce store with Shopify for selling handmade candles." | Shopify |
커넥터가 없는 서비스라도 Lovable은 모든 REST API를 통합할 수 있습니다. 모든 API 연결하기에서 설명하듯 base URL, 인증 방식, 필요한 endpoint를 알려 주세요.
AI 어시스턴트가 앱을 사용하게 하기
연결은 반대 방향으로도 동작합니다. 앱이 자체 도구를 노출하면 ChatGPT나 Claude 같은 AI 어시스턴트가 앱을 사용할 수 있습니다. 에이전트 통합을 참고하세요.
Add Agent integrations to this app so users can connect it to AI assistants like ChatGPT and Claude.자동화와 관리
관리자용 분석 영역 추가하기
이 프롬프트는 앱 자체 데이터를 대상으로 리포트를 만듭니다. 방문자 트래픽은 프롬프트 없이도 쓸 수 있는 기본 제공 분석이 있습니다.
Create an admin-only analytics area. Show total users, signups per week as a chart, most active users, and content created over time. Only admins can open it. Add date range filters and CSV export of the underlying numbers.반복 작업 예약하기
Job은 백엔드에서 일정에 따라 실행됩니다(예약 작업 참고). 이 예시는 이메일을 보내므로 앱 이메일 발송 설정이 필요합니다.
Add a scheduled job that runs every morning at 8:00, finds tasks due within the next 24 hours, and emails each task's owner a reminder listing their due tasks. Log each run so I can see when it ran and how many reminders it sent.PDF로 내보내기
Add a "Download PDF" button to the invoice view that generates a PDF matching the on-screen invoice: logo, line items, totals, and payment details. Name the file with the invoice number, and make sure long item lists paginate cleanly.감사 로그 추가하기
Add an audit log for admins. Record every sensitive action (login, role change, record deletion, settings change) with who did it, when, and from where. Make the log searchable and filterable by user, action type, and date range, and make entries read-only so they cannot be edited or deleted from the app.기능 플래그 추가하기
Add a simple feature flag system. Admins can turn features on or off from a settings panel without a new deploy, target a flag to all users or only admins, and see which flags are active. Gate the new reporting section behind a flag as the first example.rate limit 추가하기
Protect the contact form and the AI endpoints from abuse. Limit each user to 10 requests per minute, show a clear "Slow down" message when the limit is hit, and log rate limit events so I can review them.키가 있는 API 제공하기
앱은 Edge Function을 통해 자체 API를 제공할 수 있습니다.
Add an API for my app's data. Authenticated users can generate and revoke personal API keys from their settings page, and use a key to read their own items over a documented endpoint. Show each key only once at creation, store it securely, and log the last time each key was used.A/B 테스트 실행하기
Add a simple A/B test to the landing page. Show half of the visitors headline A and half headline B, keep each visitor's variant stable across visits, and record how many from each variant click the signup button. Add an admin view comparing the results.이벤트에 반응하기
백엔드 로직은 Edge Function에서 실행되므로, 앱이 webhook이나 데이터 변경 같은 이벤트에 반응할 수 있습니다.
When a payment is marked 'paid' in Stripe, automatically update the related invoice's status to 'Paid'.데이터베이스 튜닝하기
Lovable은 자기 백엔드를 점검하고 최적화할 수 있습니다. 정책, 백업, SQL 접근은 데이터베이스 문서를 참고하세요.
Run a health check on my Cloud database.My app feels slow. Find the slowest database queries and optimize the worst ones.AI 기능
이 프롬프트들은 기본 제공 AI 커넥터를 사용합니다. API 키나 제공자 계정이 필요 없습니다.
AI 어시스턴트 추가하기
Add an AI assistant to the app. Users open a chat panel and ask questions about their own data in the app, and the assistant answers conversationally. Stream the responses, keep each user's conversation history, and show a friendly empty state suggesting three example questions.AI 글쓰기 도우미 추가하기
Add an AI writing helper to the notes editor. An "Improve" menu offers four actions: summarize, fix grammar, change tone to professional or friendly, and translate to Spanish. Show the result next to the original text with "Replace" and "Copy" actions.시맨틱 검색 추가하기
Add semantic search to the knowledge base. Users type a question and get the most relevant articles by meaning rather than keyword match, with a short AI-generated answer on top that cites the matched articles. Fall back to regular search when there is no good match.이미지 생성하기
Let users generate images in the app. They describe the image they want, pick a style from a few presets, and get a result they can regenerate, download, or attach to their post. Show a loading state while the image is being created.음성 기능 추가하기
Add voice to the notes app. Users can dictate a note by speaking, and the app transcribes it into text they can edit. Add a "Listen" button that reads any note aloud. Show a clear recording indicator while the microphone is active.콘텐츠 추천하기
Add a "Recommended for you" section to the home page. Suggest items based on what the user has viewed and saved, refresh the suggestions daily, and show new users popular items with a note explaining why they are seeing them.AI로 폼 자동 채우기
Make the listing form smarter. When a user writes a title, suggest a description, category, and tags they can accept or edit. Mark suggested values clearly until confirmed so users always know what they typed and what was suggested.테스트, 디버깅, 보안
Lovable은 실제 브라우저를 조작해 앱의 플로를 검증하고, 코드에서 보안 문제를 검토할 수 있습니다. 자세한 내용은 테스트, 브라우저 테스트, 보안에 있습니다. 버그를 체계적으로 잡는 방법은 디버깅 가이드를 참고하세요.
브라우저에서 플로 검증하기
Use browser testing to verify the checkout flow.버그 재현하고 고치기
The page crashes when I click my profile. Reproduce it in the browser, fix it, and then verify that your fix worked.보안 검토 실행하기
Review my app's security. Check the authentication flow and whether my API routes are secure.게시와 성장
게시, 커스텀 도메인, SEO, 방문자 분석은 각각 별도의 문서 페이지가 있습니다. Lovable은 채팅에서 앱을 배포하고, 검색 결과와 링크 미리보기에 어떻게 보일지를 다듬을 수 있습니다. 게시한 뒤에는 SEO 검토를 실행해 라이브 사이트의 색인, 메타데이터, 성능을 확인하세요.
채팅에서 게시하기
publish 도구를 자동 승인으로 설정하지 않았다면 Lovable이 배포 전에 승인을 요청하며, 원하는 서브도메인을 지정할 수 있습니다.
Publish my app to my-cafe.lovable.app.사이트 메타데이터 다듬기
Change my site title, write a new meta description, and generate a new social sharing image.직접 프롬프트 쓰기
바로 맞는 프롬프트가 없다면 다음 템플릿을 채우세요. 더 많은 항목을 채울수록 첫 결과가 머릿속 그림에 가까워집니다. 해당하지 않는 부분은 건너뛰어도 됩니다.
Design a [page or feature] with a [style] look.
Visual style:
- [Color palette]
- [Typography]
- [Spacing and layout]
Interactions:
- [Hover and click behavior]
- [Transitions and animations]
- [Loading, error, and empty states]
Structure:
- [Sections in order]
- [Navigation]
Responsive behavior:
- Desktop: [layout]
- Mobile: [what changes]거의 모든 프롬프트를 좋게 만드는 표현이 몇 가지 있습니다.
| 개선하고 싶은 것 | 이런 표현을 더하세요 |
|---|---|
| 여백 | "Generous padding and breathing room", "extra whitespace between sections", "comfortable touch targets on mobile" |
| 타이포그래피 | "Clear typographic hierarchy", "use the Inter font", "optimized for reading with proper line height" |
| 상호작용 | "Smooth micro-interactions", "subtle transitions on all interactive elements", "hover states that feel responsive" |
| 깊이감 | "Layered shadows for depth", "subtle gradients for visual interest" |
| 반응형 | "Three columns on desktop, one on mobile", "collapsible navigation on mobile" |
| 마감 완성도 | "Include loading, error, and empty states", "helpful microcopy and labels", "accessible contrast" |
미니멀, 프리미엄, 경쾌함 같은 스타일 어휘는 위 디자인과 스타일 섹션의 스타일 레퍼런스를 사용하세요. 모든 요소를 일일이 설명하는 대신 커뮤니티 라이브러리의 기성 컴포넌트로 빌드하려면 Lovable에서 21st.dev 컴포넌트 사용하기를 참고하세요.