Recreate a live website as a design frame in Replit Design, then refine it with suggestions and chat, and build it into an app.
⏰ Estimated time: 10 minutesSometimes the design you want to start from is already live on the web: your current site, or a page whose look you want to rebuild. Import from URL recreates a website as a design frame you can explore, refine, and build into an interactive app.You’ll use creative-studio-landing.replit.app, a Replit-built landing page for a creative studio, as the example.
Follow a suggestion: the import arrives with proposed next steps, such as a dark editorial variant, a mobile viewport, or a contact page. Each generates as a fresh frame, so the original stays for comparison.
Chat about it: use the input under the frame and brief it in your own words, “swap the portfolio shots”, “make the hero type heavier”.
The imported frame selected, with suggested next steps proposing a dark editorial variant, a mobile viewport, and a contact page.
Polish text, colors, spacing, and images directly.
Build your design
Turn the finished frame into a working app.
Was this page helpful?
{"docsConfig":{"theme":"aspen","$schema":"https://mintlify.com/docs.json","name":"Replit","colors":{"primary":"#FF3C00","light":"#FF3C00","dark":"#FF3C00"},"logo":{"light":"https://mintcdn.com/replit/j4of5To8jzehz0JK/logo/light.svg?fit=max\u0026auto=format\u0026n=j4of5To8jzehz0JK\u0026q=85\u0026s=6209cb5927b56fd1781133af05428373","dark":"https://mintcdn.com/replit/j4of5To8jzehz0JK/logo/dark.svg?fit=max\u0026auto=format\u0026n=j4of5To8jzehz0JK\u0026q=85\u0026s=9cbba158300d48c49d8b888e71015495","href":"/welcome"},"favicon":"https://mintcdn.com/replit/CmOMKRnamiqG44eH/favicon.ico?fit=max\u0026auto=format\u0026n=CmOMKRnamiqG44eH\u0026q=85\u0026s=c89a6df6f537373c946c7a5f0ac65475","appearance":{"default":"light"},"background":{"color":{"light":"#F6F5F4","dark":"#1E1E1F"}},"navbar":{"links":[],"primary":{"type":"button","label":"Start Building","href":"https://replit.com?ref=docs"}},"footer":{"socials":{"x":"https://x.com/replit","linkedin":"https://www.linkedin.com/company/repl-it","youtube":"https://www.youtube.com/@replit"}},"seo":{"metatags":{"og:site_name":"Replit Docs","twitter:site":"@replit","twitter:creator":"@replit","author":"Replit"},"indexing":"all"},"fonts":{"heading":{"family":"ABC Diatype Plus","weight":400,"source":"https://cdn.replit.com/dotcom/fonts/ABCDiatypePlusVariable.woff2","format":"woff2"},"body":{"family":"ABC Diatype Plus","weight":400,"source":"https://cdn.replit.com/dotcom/fonts/ABCDiatypePlusVariable.woff2","format":"woff2"}},"integrations":{"segment":{"key":"dMePKGC4BqfBivpe0Hvl8IoPpzSHgjdX"}},"contextual":{"options":["copy","view"],"display":"header"},"thumbnails":{"appearance":"light","background":"https://mintcdn.com/replit/j4of5To8jzehz0JK/thumb.png?fit=max\u0026auto=format\u0026n=j4of5To8jzehz0JK\u0026q=85\u0026s=a7db7f0256b2fa06810fb4d378e63cc5","fonts":{"family":"ABC Diatype Plus"}},"styling":{"latex":true},"navigation":{"languages":[{"language":"en","href":"welcome"},{"language":"fr","navbar":{"links":[],"primary":{"type":"button","label":"Commencer à créer","href":"https://replit.com?ref=docs"}},"href":"fr/welcome"},{"language":"pt","hidden":false,"navbar":{"links":[],"primary":{"type":"button","label":"Comece a criar","href":"https://replit.com?ref=docs"}},"href":"pt/welcome"},{"language":"ja","hidden":false,"navbar":{"links":[],"primary":{"type":"button","label":"作成を開始","href":"https://replit.com?ref=docs"}},"href":"ja/welcome"},{"language":"ko","hidden":false,"navbar":{"links":[],"primary":{"type":"button","label":"빌드 시작하기","href":"https://replit.com?ref=docs"}},"href":"ko/welcome"}]}},"deployment":{"deploymentMetadataValue":{"subdomain":"replit","hasAudioNarration":false,"actualSubdomain":"replit","customDomains":["docs.replit.com","docs.repl.it"],"gitSource":{"type":"github","owner":"replit","repo":"replit-docs","deployBranch":"main","contentDirectory":"docs","isPrivate":true,"mountPath":"","label":""},"feedback":{"thumbs":true,"issues":true,"edits":false},"entitlements":{"AI_CHAT":{"status":"DISABLED"},"REMOVE_BRANDING":{"status":"ENABLED"},"CONTEXTUAL_FEEDBACK":{"status":"ENABLED"},"CODE_SNIPPET_FEEDBACK":{"status":"ENABLED"},"WEB_MCP":{"status":"ENABLED"},"NARRATION":{"status":"DISABLED"}},"buildId":"6aee55254219cf14872521f4","clientVersion":"0.0.4087","searchFilterCounts":[{"language":"en","tag":"Features","count":360},{"language":"fr","tag":"Fonctionnalités","count":359},{"language":"ja","tag":"機能","count":359},{"language":"ko","tag":"기능","count":359},{"language":"pt","tag":"Funcionalidades","count":359},{"language":"en","tag":"Changelog","count":100},{"language":"fr","tag":"Journal des modifications","count":99},{"language":"ja","tag":"変更履歴","count":99},{"language":"ko","tag":"변경 내역","count":99},{"language":"pt","tag":"Registro de alterações","count":99},{"language":"en","tag":"Apps","count":41},{"language":"fr","tag":"Apps","count":41},{"language":"ja","tag":"Apps","count":41},{"language":"ko","tag":"Apps","count":41},{"language":"pt","tag":"Apps","count":41},{"language":"en","tag":"Enterprise","count":40},{"language":"fr","tag":"Entreprise","count":40},{"language":"ja","tag":"Enterprise","count":40},{"language":"ko","tag":"Enterprise","count":40},{"language":"pt","tag":"Enterprise","count":40},{"language":"en","tag":"Use cases","count":39},{"language":"fr","tag":"Use cases","count":39},{"language":"ja","tag":"Use cases","count":39},{"language":"ko","tag":"Use cases","count":39},{"language":"pt","tag":"Use cases","count":39},{"language":"en","tag":"Chats","count":25},{"language":"en","tag":"Designs","count":25},{"language":"fr","tag":"Chats","count":25},{"language":"fr","tag":"Designs","count":25},{"language":"ja","tag":"Chats","count":25},{"language":"ja","tag":"Designs","count":25},{"language":"ko","tag":"Chats","count":25},{"language":"ko","tag":"Designs","count":25},{"language":"pt","tag":"Chats","count":25},{"language":"pt","tag":"Designs","count":25},{"language":"en","tag":"Trust \u0026 Billing","count":23},{"language":"fr","tag":"Confiance et facturation","count":23},{"language":"ja","tag":"信頼と請求","count":23},{"language":"ko","tag":"신뢰 및 결제","count":23},{"language":"pt","tag":"Confiança e faturamento","count":23},{"language":"en","tag":"Web","count":22},{"language":"fr","tag":"Web","count":22},{"language":"ja","tag":"Web","count":22},{"language":"ko","tag":"Web","count":22},{"language":"pt","tag":"Web","count":22},{"language":"en","tag":"Help","count":20},{"language":"fr","tag":"Help","count":20},{"language":"ja","tag":"Help","count":20},{"language":"ko","tag":"Help","count":20},{"language":"pt","tag":"Help","count":20}]},"assistantConfig":{"deflection":{"enabled":true,"email":"support@replit.com"}},"basePath":"","hasChatPermissions":false,"hasWebMcpPermissions":true,"toggles":[{"name":"kill-isr","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"agent-mintlify-slack","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"agent-integrations-settings","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"rbac-expansion","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"automations-pr-grouping","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"custom-prefix","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"analytics-v7","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"user-flows-analytics","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"no-publish-flow","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"workos-onboarding","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"llms-txt-v2","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"snapshot-serving-live","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"stripTemperatureMiddleware","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"support-platform-pylon-zendesk","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"snapshot-serving","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"instant-rollback","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"granular-notifications-server","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"granular-notifications","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"automations-fable","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"fixed-ai-action-pricing","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"automation-resolve-merge-conflict","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"scoped-publishing","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"mintql","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"page-level-analytics","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"editor-version-history-v2","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"billing-page-v2","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"full-page-search","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"workspace-projects","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"assistant-v5","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"fork-pr-previews","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"revalidation-jwt","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"workos-sso-scim","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"hobby-abuse-scan","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"dashboard-inbox","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"workos-signup","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"turbopuffer-dual-write","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"workos-enabled","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"approve-review-flow","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"editor-metadata","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"sso-setup-deadline-banner","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"turbopuffer-serve","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"live-agents","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false},{"name":"comment-mode","enabled":true,"variant":{"name":"disabled","enabled":false,"feature_enabled":true},"impressionData":false}],"googleFontsInlined":false},"customCss":[{"filePath":"styles.css","href":"/_mintlify/custom/replit/795eee5cda55dee3/styles.css"}],"page":{"pagePath":"design/import-a-website-into-replit-design","slug":"/design/import-a-website-into-replit-design","pageMetadata":{"title":"Import a website into Replit Design","sidebarTitle":"Import from URL","description":"Recreate a live website as a design frame in Replit Design, then refine it with suggestions and chat, and build it into an app.","icon":"link","href":"/design/import-a-website-into-replit-design"},"description":{"compiledSource":"\"use strict\";\nconst {jsx: _jsx} = arguments[0];\nconst {useMDXComponents: _provideComponents} = arguments[0];\nfunction _createMdxContent(props) {\n const _components = {\n p: \"p\",\n ..._provideComponents(),\n ...props.components\n };\n return _jsx(_components.p, {\n children: \"Recreate a live website as a design frame in Replit Design, then refine it with suggestions and chat, and build it into an app.\"\n });\n}\nfunction MDXContent(props = {}) {\n const {wrapper: MDXLayout} = {\n ..._provideComponents(),\n ...props.components\n };\n return MDXLayout ? _jsx(MDXLayout, {\n ...props,\n children: _jsx(_createMdxContent, {\n ...props\n })\n }) : _createMdxContent(props);\n}\nreturn {\n default: MDXContent\n};\n","frontmatter":{},"scope":{}},"pageType":"default","mdx":{"mdxSource":{"compiledSource":"\"use strict\";const{Fragment:_Fragment,jsx:_jsx,jsxs:_jsxs}=arguments[0];const{useMDXComponents:_provideComponents}=arguments[0];function _createMdxContent(props){const _components={a:`a`,code:`code`,em:`em`,li:`li`,p:`p`,strong:`strong`,ul:`ul`,..._provideComponents(),...props.components},{Card,CardGroup,Frame,Heading,OptimizedImage,Step,Steps}=_components;if(!Card)_missingMdxReference(`Card`,true);if(!CardGroup)_missingMdxReference(`CardGroup`,true);if(!Frame)_missingMdxReference(`Frame`,true);if(!Heading)_missingMdxReference(`Heading`,true);if(!OptimizedImage)_missingMdxReference(`OptimizedImage`,true);if(!Step)_missingMdxReference(`Step`,true);if(!Steps)_missingMdxReference(`Steps`,true);return _jsxs(_Fragment,{children:[_jsxs(_components.p,{children:[`⏰ `,_jsx(_components.em,{children:`Estimated time: 10 minutes`})]}),`\n`,_jsx(_components.p,{children:`Sometimes the design you want to start from is already live on the web: your current site, or a page whose look you want to rebuild. Import from URL recreates a website as a design frame you can explore, refine, and build into an interactive app.`}),`\n`,_jsxs(_components.p,{children:[`You’ll use `,_jsx(_components.a,{href:`https://creative-studio-landing.replit.app`,children:`creative-studio-landing.replit.app`}),`, a Replit-built landing page for a creative studio, as the example.`]}),`\n`,_jsx(Heading,{level:`2`,id:`before-you-start`,children:`Before you start`}),`\n`,_jsx(_components.p,{children:`You need:`}),`\n`,_jsxs(_components.ul,{children:[`\n`,_jsxs(_components.li,{children:[`A `,_jsx(_components.a,{href:`https://replit.com`,children:`Replit account`}),`.`]}),`\n`,_jsx(_components.li,{children:`The URL of a public website, or the example above.`}),`\n`]}),`\n`,_jsx(Heading,{level:`2`,id:`import-the-website`,children:`Import the website`}),`\n`,_jsxs(Steps,{children:[_jsxs(Step,{title:`Copy the site's URL`,children:[_jsxs(_components.p,{children:[`Use your own site, or copy the example: `,_jsx(_components.code,{children:`https://creative-studio-landing.replit.app`}),`.`]}),_jsx(Frame,{caption:`The example site: Kosmo Studio, a creative studio landing page.`,children:_jsx(OptimizedImage,{src:`https://mintcdn.com/replit/9Q_lVrxG2Dh35jz1/images/design/import-from-url/url-example-site.webp?fit=max\u0026auto=format\u0026n=9Q_lVrxG2Dh35jz1\u0026q=85\u0026s=267942c299f996750150594e6b48b55d`,alt:`The Kosmo Studio landing page with the headline We craft bold ideas and visuals that truly work, above a fan of artwork cards`,\"data-og-width\":`3440`,width:`3440`,\"data-og-height\":`2160`,height:`2160`,\"data-path\":`images/design/import-from-url/url-example-site.webp`,\"data-optimize\":`true`,\"data-opv\":`3`,srcset:`https://mintcdn.com/replit/9Q_lVrxG2Dh35jz1/images/design/import-from-url/url-example-site.webp?w=280\u0026fit=max\u0026auto=format\u0026n=9Q_lVrxG2Dh35jz1\u0026q=85\u0026s=a58aa81a3889d731ffefffe85b23157f 280w, https://mintcdn.com/replit/9Q_lVrxG2Dh35jz1/images/design/import-from-url/url-example-site.webp?w=560\u0026fit=max\u0026auto=format\u0026n=9Q_lVrxG2Dh35jz1\u0026q=85\u0026s=e8131f6951c1c380e7cf289f797ce63d 560w, https://mintcdn.com/replit/9Q_lVrxG2Dh35jz1/images/design/import-from-url/url-example-site.webp?w=840\u0026fit=max\u0026auto=format\u0026n=9Q_lVrxG2Dh35jz1\u0026q=85\u0026s=22b42600937fd794b81019e34cc7e166 840w, https://mintcdn.com/replit/9Q_lVrxG2Dh35jz1/images/design/import-from-url/url-example-site.webp?w=1100\u0026fit=max\u0026auto=format\u0026n=9Q_lVrxG2Dh35jz1\u0026q=85\u0026s=a837ab40428c16a4444196c3b5929390 1100w, https://mintcdn.com/replit/9Q_lVrxG2Dh35jz1/images/design/import-from-url/url-example-site.webp?w=1650\u0026fit=max\u0026auto=format\u0026n=9Q_lVrxG2Dh35jz1\u0026q=85\u0026s=efadf2b43baebe9a4608990631f6a1d1 1650w, https://mintcdn.com/replit/9Q_lVrxG2Dh35jz1/images/design/import-from-url/url-example-site.webp?w=2500\u0026fit=max\u0026auto=format\u0026n=9Q_lVrxG2Dh35jz1\u0026q=85\u0026s=fb2ade0ec196c03a4cab85280b7998af 2500w`})})]}),_jsxs(Step,{title:`Open Replit Design`,children:[_jsxs(_components.p,{children:[`Go to `,_jsx(_components.a,{href:`https://replit.com/design`,children:`replit.com/design`}),` and select `,_jsx(_components.strong,{children:`Import URL`}),` under the prompt box. Agent recreates the site’s look and feel as a starting point.`]}),_jsx(Frame,{caption:`Import URL on the Replit Design home: paste a link to any website.`,children:_jsx(OptimizedImage,{src:`https://mintcdn.com/replit/9Q_lVrxG2Dh35jz1/images/design/import-from-url/design-import-url.webp?fit=max\u0026auto=format\u0026n=9Q_lVrxG2Dh35jz1\u0026q=85\u0026s=e4cbc39f9f040bcb1b4950984d27bcd2`,alt:`The Replit Design home with the Import URL option selected and a tooltip reading Paste a link to any website and Agent will recreate its look and feel as a starting point`,\"data-og-width\":`2293`,width:`2293`,\"data-og-height\":`1322`,height:`1322`,\"data-path\":`images/design/import-from-url/design-import-url.webp`,\"data-optimize\":`true`,\"data-opv\":`3`,srcset:`https://mintcdn.com/replit/9Q_lVrxG2Dh35jz1/images/design/import-from-url/design-import-url.webp?w=280\u0026fit=max\u0026auto=format\u0026n=9Q_lVrxG2Dh35jz1\u0026q=85\u0026s=e075155bc2b03bdf867c069cd18e27e7 280w, https://mintcdn.com/replit/9Q_lVrxG2Dh35jz1/images/design/import-from-url/design-import-url.webp?w=560\u0026fit=max\u0026auto=format\u0026n=9Q_lVrxG2Dh35jz1\u0026q=85\u0026s=c1395a2301355e8a0a2ff153abe75f6a 560w, https://mintcdn.com/replit/9Q_lVrxG2Dh35jz1/images/design/import-from-url/design-import-url.webp?w=840\u0026fit=max\u0026auto=format\u0026n=9Q_lVrxG2Dh35jz1\u0026q=85\u0026s=5efda3f15dd6b24e22e6137a7f82d9d9 840w, https://mintcdn.com/replit/9Q_lVrxG2Dh35jz1/images/design/import-from-url/design-import-url.webp?w=1100\u0026fit=max\u0026auto=format\u0026n=9Q_lVrxG2Dh35jz1\u0026q=85\u0026s=3ae81e4e210f9f1bd695e7ab891a3a9e 1100w, https://mintcdn.com/replit/9Q_lVrxG2Dh35jz1/images/design/import-from-url/design-import-url.webp?w=1650\u0026fit=max\u0026auto=format\u0026n=9Q_lVrxG2Dh35jz1\u0026q=85\u0026s=735c51ae732553d8b5d00c67501cbb79 1650w, https://mintcdn.com/replit/9Q_lVrxG2Dh35jz1/images/design/import-from-url/design-import-url.webp?w=2500\u0026fit=max\u0026auto=format\u0026n=9Q_lVrxG2Dh35jz1\u0026q=85\u0026s=2650da699999b781a88651d7e31e49d6 2500w`})})]}),_jsxs(Step,{title:`Paste the URL and start building`,children:[_jsxs(_components.p,{children:[`Selecting `,_jsx(_components.strong,{children:`Import URL`}),` prefills the prompt: `,_jsx(_components.em,{children:`“Recreate the look and feel of this website:”`}),`. Paste your URL after it and select `,_jsx(_components.strong,{children:`Start`}),`.`]}),_jsx(Frame,{caption:`The prefilled recreate prompt with the example URL, ready to start.`,children:_jsx(OptimizedImage,{src:`https://mintcdn.com/replit/9Q_lVrxG2Dh35jz1/images/design/import-from-url/design-url-prompt.webp?fit=max\u0026auto=format\u0026n=9Q_lVrxG2Dh35jz1\u0026q=85\u0026s=ed6fcfa2a942facfe2d4ede695445926`,alt:`The Replit Design prompt box reading Recreate the look and feel of this website followed by the example URL, with the Start button`,\"data-og-width\":`2293`,width:`2293`,\"data-og-height\":`1322`,height:`1322`,\"data-path\":`images/design/import-from-url/design-url-prompt.webp`,\"data-optimize\":`true`,\"data-opv\":`3`,srcset:`https://mintcdn.com/replit/9Q_lVrxG2Dh35jz1/images/design/import-from-url/design-url-prompt.webp?w=280\u0026fit=max\u0026auto=format\u0026n=9Q_lVrxG2Dh35jz1\u0026q=85\u0026s=f3e6160fe56dcdce2ef1b481b7b2dd46 280w, https://mintcdn.com/replit/9Q_lVrxG2Dh35jz1/images/design/import-from-url/design-url-prompt.webp?w=560\u0026fit=max\u0026auto=format\u0026n=9Q_lVrxG2Dh35jz1\u0026q=85\u0026s=887a4b2d327ed54f96c2ac25d6f03ead 560w, https://mintcdn.com/replit/9Q_lVrxG2Dh35jz1/images/design/import-from-url/design-url-prompt.webp?w=840\u0026fit=max\u0026auto=format\u0026n=9Q_lVrxG2Dh35jz1\u0026q=85\u0026s=998489323ad69aeb00686444207f322e 840w, https://mintcdn.com/replit/9Q_lVrxG2Dh35jz1/images/design/import-from-url/design-url-prompt.webp?w=1100\u0026fit=max\u0026auto=format\u0026n=9Q_lVrxG2Dh35jz1\u0026q=85\u0026s=e97fbc6ae58da5c4865a2cfe2b1a8372 1100w, https://mintcdn.com/replit/9Q_lVrxG2Dh35jz1/images/design/import-from-url/design-url-prompt.webp?w=1650\u0026fit=max\u0026auto=format\u0026n=9Q_lVrxG2Dh35jz1\u0026q=85\u0026s=08b26d1b1a526277383a80755c0e0c9f 1650w, https://mintcdn.com/replit/9Q_lVrxG2Dh35jz1/images/design/import-from-url/design-url-prompt.webp?w=2500\u0026fit=max\u0026auto=format\u0026n=9Q_lVrxG2Dh35jz1\u0026q=85\u0026s=a011bfeb75ad201da767f0620ef34384 2500w`})})]})]}),`\n`,_jsx(_components.p,{children:`Agent recreates the site as a design frame in your project.`}),`\n`,_jsx(Frame,{caption:`The recreated Kosmo Studio landing page as a design frame in Replit Design.`,children:_jsx(OptimizedImage,{src:`https://mintcdn.com/replit/9Q_lVrxG2Dh35jz1/images/design/import-from-url/url-import-result.webp?fit=max\u0026auto=format\u0026n=9Q_lVrxG2Dh35jz1\u0026q=85\u0026s=25c050750522f9306c84091ccb147e86`,alt:`The recreated Kosmo Studio landing page as a design frame in Replit Design, with the run marked complete in the chat panel`,\"data-og-width\":`1600`,width:`1600`,\"data-og-height\":`1004`,height:`1004`,\"data-path\":`images/design/import-from-url/url-import-result.webp`,\"data-optimize\":`true`,\"data-opv\":`3`,srcset:`https://mintcdn.com/replit/9Q_lVrxG2Dh35jz1/images/design/import-from-url/url-import-result.webp?w=280\u0026fit=max\u0026auto=format\u0026n=9Q_lVrxG2Dh35jz1\u0026q=85\u0026s=1c4f1433819175884e926d82044b4d4e 280w, https://mintcdn.com/replit/9Q_lVrxG2Dh35jz1/images/design/import-from-url/url-import-result.webp?w=560\u0026fit=max\u0026auto=format\u0026n=9Q_lVrxG2Dh35jz1\u0026q=85\u0026s=4eea0e24d7e4b7524cc593251c4ee400 560w, https://mintcdn.com/replit/9Q_lVrxG2Dh35jz1/images/design/import-from-url/url-import-result.webp?w=840\u0026fit=max\u0026auto=format\u0026n=9Q_lVrxG2Dh35jz1\u0026q=85\u0026s=a0b71c2617e47c1ed9a40852f11c85f0 840w, https://mintcdn.com/replit/9Q_lVrxG2Dh35jz1/images/design/import-from-url/url-import-result.webp?w=1100\u0026fit=max\u0026auto=format\u0026n=9Q_lVrxG2Dh35jz1\u0026q=85\u0026s=ea01447b796abe064539721848e68eda 1100w, https://mintcdn.com/replit/9Q_lVrxG2Dh35jz1/images/design/import-from-url/url-import-result.webp?w=1650\u0026fit=max\u0026auto=format\u0026n=9Q_lVrxG2Dh35jz1\u0026q=85\u0026s=00d480c3cad9a893275a32c23f492028 1650w, https://mintcdn.com/replit/9Q_lVrxG2Dh35jz1/images/design/import-from-url/url-import-result.webp?w=2500\u0026fit=max\u0026auto=format\u0026n=9Q_lVrxG2Dh35jz1\u0026q=85\u0026s=373ea3b878554026c538ff54e506b43a 2500w`})}),`\n`,_jsx(Heading,{level:`2`,id:`make-it-yours`,children:`Make it yours`}),`\n`,_jsx(_components.p,{children:`Select the imported frame and start reshaping it:`}),`\n`,_jsxs(_components.ul,{children:[`\n`,_jsxs(_components.li,{children:[_jsxs(_components.strong,{children:[`Follow a `,_jsx(_components.a,{href:`/design/explore-suggestions`,children:`suggestion`})]}),`: the import arrives with proposed next steps, such as a dark editorial variant, a mobile viewport, or a contact page. Each generates as a fresh frame, so the original stays for comparison.`]}),`\n`,_jsxs(_components.li,{children:[_jsx(_components.strong,{children:_jsx(_components.a,{href:`/design/chat-about-your-design`,children:`Chat about it`})}),`: use the input under the frame and brief it in your own words, `,_jsx(_components.em,{children:`“swap the portfolio shots”`}),`, `,_jsx(_components.em,{children:`“make the hero type heavier”`}),`.`]}),`\n`]}),`\n`,_jsx(Frame,{caption:`The imported frame selected, with suggested next steps proposing a dark editorial variant, a mobile viewport, and a contact page.`,children:_jsx(OptimizedImage,{src:`https://mintcdn.com/replit/9Q_lVrxG2Dh35jz1/images/design/import-from-url/url-make-it-yours.webp?fit=max\u0026auto=format\u0026n=9Q_lVrxG2Dh35jz1\u0026q=85\u0026s=d0ec30760d7803f73c8edd1a4427dcbd`,alt:`The recreated Creative Studio frame selected in Replit Design, with the Suggested next steps panel beside it proposing a dark editorial variant, a mobile viewport, a contact page, and different approaches`,\"data-og-width\":`1600`,width:`1600`,\"data-og-height\":`1004`,height:`1004`,\"data-path\":`images/design/import-from-url/url-make-it-yours.webp`,\"data-optimize\":`true`,\"data-opv\":`3`,srcset:`https://mintcdn.com/replit/9Q_lVrxG2Dh35jz1/images/design/import-from-url/url-make-it-yours.webp?w=280\u0026fit=max\u0026auto=format\u0026n=9Q_lVrxG2Dh35jz1\u0026q=85\u0026s=f0be2f07ec7beb21e24bddd2f10f2daa 280w, https://mintcdn.com/replit/9Q_lVrxG2Dh35jz1/images/design/import-from-url/url-make-it-yours.webp?w=560\u0026fit=max\u0026auto=format\u0026n=9Q_lVrxG2Dh35jz1\u0026q=85\u0026s=0cf135bce0f18757c7df5a34d70866ac 560w, https://mintcdn.com/replit/9Q_lVrxG2Dh35jz1/images/design/import-from-url/url-make-it-yours.webp?w=840\u0026fit=max\u0026auto=format\u0026n=9Q_lVrxG2Dh35jz1\u0026q=85\u0026s=500e110dc1348425a9b1b490ba37ecee 840w, https://mintcdn.com/replit/9Q_lVrxG2Dh35jz1/images/design/import-from-url/url-make-it-yours.webp?w=1100\u0026fit=max\u0026auto=format\u0026n=9Q_lVrxG2Dh35jz1\u0026q=85\u0026s=321b856d4605e96b5d11cc7ebda15b28 1100w, https://mintcdn.com/replit/9Q_lVrxG2Dh35jz1/images/design/import-from-url/url-make-it-yours.webp?w=1650\u0026fit=max\u0026auto=format\u0026n=9Q_lVrxG2Dh35jz1\u0026q=85\u0026s=9f1d4a0b4fb8a30ae9ff7b4f531caa59 1650w, https://mintcdn.com/replit/9Q_lVrxG2Dh35jz1/images/design/import-from-url/url-make-it-yours.webp?w=2500\u0026fit=max\u0026auto=format\u0026n=9Q_lVrxG2Dh35jz1\u0026q=85\u0026s=767adf66386bf8ec4a46474a8c752ec7 2500w`})}),`\n`,_jsx(Heading,{level:`2`,id:`next-steps`,children:`Next steps`}),`\n`,_jsxs(CardGroup,{cols:3,children:[_jsx(Card,{title:`Explore suggestions`,icon:`lightbulb`,href:`/design/explore-suggestions`,children:_jsx(_components.p,{children:`Explore what to design next, one click at a time.`})}),_jsx(Card,{title:`Visual Editor`,icon:`pen-to-square`,href:`/design/visual-editor`,children:_jsx(_components.p,{children:`Polish text, colors, spacing, and images directly.`})}),_jsx(Card,{title:`Build your design`,icon:`hammer`,href:`/design/build-your-design`,children:_jsx(_components.p,{children:`Turn the finished frame into a working app.`})})]})]})}function MDXContent(props={}){const{wrapper:MDXLayout}={..._provideComponents(),...props.components};return MDXLayout?_jsx(MDXLayout,{...props,children:_jsx(_createMdxContent,{...props})}):_createMdxContent(props)}return{default:MDXContent};function _missingMdxReference(id,component){throw new Error(`Expected `+(component?`component`:`object`)+\" `\"+id+\"` to be defined: you likely forgot to import, pass, or provide it.\")}","frontmatter":{},"scope":{"config":{},"pageMetadata":{"title":"Import a website into Replit Design","sidebarTitle":"Import from URL","description":"Recreate a live website as a design frame in Replit Design, then refine it with suggestions and chat, and build it into an app.","icon":"link","href":"/design/import-a-website-into-replit-design"}}},"mdxSourceWithNoJs":null},"mdxExtracts":{"tableOfContents":[{"title":"Before you start","slug":"before-you-start","depth":2,"children":[]},{"title":"Import the website","slug":"import-the-website","depth":2,"children":[]},{"title":"Make it yours","slug":"make-it-yours","depth":2,"children":[]},{"title":"Next steps","slug":"next-steps","depth":2,"children":[]}],"codeExamples":{}},"jsLinks":[],"subdomain":"replit","siteName":"Replit","title":"Import a website into Replit Design - Replit","navMaps":{"firstHrefInVersion":{},"firstHrefInLanguage":{"en":{"href":"/design/import-a-website-into-replit-design","matchLevel":0},"fr":{"href":"/fr/design/import-a-website-into-replit-design","matchLevel":1},"pt":{"href":"/pt/design/import-a-website-into-replit-design","matchLevel":1},"ja":{"href":"/ja/design/import-a-website-into-replit-design","matchLevel":1},"ko":{"href":"/ko/design/import-a-website-into-replit-design","matchLevel":1}}},"lastModified":"2026-07-29T15:47:19.950Z","originalFileLocation":"design/import-a-website-into-replit-design.mdx","locale":"en"},"headHtml":"\u003cscript data-mint-head>(function(){var d=document.documentElement,p=null;if(!p){try{p=localStorage.getItem(\"isDarkMode\")}catch(e){}if(p==='true')p='dark';else if(p==='false')p='light';if(p!=='light'\u0026\u0026p!=='dark'\u0026\u0026p!=='system')p=\"light\"}var r=p==='system'?(matchMedia(\"(prefers-color-scheme: dark)\").matches?'dark':'light'):p;d.classList.remove(r==='dark'?'light':'dark');d.classList.add(r);d.setAttribute(\"data-theme-preference\",p)})();\u003c/script>\u003cmeta data-mint-head name=\"description\" content=\"Recreate a live website as a design frame in Replit Design, then refine it with suggestions and chat, and build it into an app.\">\u003cmeta data-mint-head name=\"application-name\" content=\"Replit\">\u003cmeta data-mint-head name=\"generator\" content=\"Mintlify\">\u003clink data-mint-head rel=\"icon\" type=\"image/png\" sizes=\"192x192\" href=\"/mintlify-assets/_mintlify/favicons/replit/bmCuvIiWqqoyeE2o/_generated/favicon/android-chrome-192x192.png\" media=\"(prefers-color-scheme: light)\">\u003clink data-mint-head rel=\"apple-touch-icon\" type=\"image/png\" sizes=\"180x180\" href=\"/mintlify-assets/_mintlify/favicons/replit/bmCuvIiWqqoyeE2o/_generated/favicon/apple-touch-icon.png\">\u003clink data-mint-head rel=\"icon\" type=\"image/png\" sizes=\"16x16\" href=\"/mintlify-assets/_mintlify/favicons/replit/bmCuvIiWqqoyeE2o/_generated/favicon/favicon-16x16.png\" media=\"(prefers-color-scheme: light)\">\u003clink data-mint-head rel=\"icon\" type=\"image/png\" sizes=\"32x32\" href=\"/mintlify-assets/_mintlify/favicons/replit/bmCuvIiWqqoyeE2o/_generated/favicon/favicon-32x32.png\" media=\"(prefers-color-scheme: light)\">\u003clink data-mint-head rel=\"shortcut icon\" type=\"image/x-icon\" href=\"/mintlify-assets/_mintlify/favicons/replit/bmCuvIiWqqoyeE2o/_generated/favicon/favicon.ico\" media=\"(prefers-color-scheme: light)\">\u003clink data-mint-head rel=\"icon\" type=\"image/png\" sizes=\"192x192\" href=\"/mintlify-assets/_mintlify/favicons/replit/bmCuvIiWqqoyeE2o/_generated/favicon-dark/android-chrome-192x192.png\" media=\"(prefers-color-scheme: dark)\">\u003clink data-mint-head rel=\"icon\" type=\"image/png\" sizes=\"16x16\" href=\"/mintlify-assets/_mintlify/favicons/replit/bmCuvIiWqqoyeE2o/_generated/favicon-dark/favicon-16x16.png\" media=\"(prefers-color-scheme: dark)\">\u003clink data-mint-head rel=\"icon\" type=\"image/png\" sizes=\"32x32\" href=\"/mintlify-assets/_mintlify/favicons/replit/bmCuvIiWqqoyeE2o/_generated/favicon-dark/favicon-32x32.png\" media=\"(prefers-color-scheme: dark)\">\u003clink data-mint-head rel=\"shortcut icon\" type=\"image/x-icon\" href=\"/mintlify-assets/_mintlify/favicons/replit/bmCuvIiWqqoyeE2o/_generated/favicon-dark/favicon.ico\" media=\"(prefers-color-scheme: dark)\">\u003cmeta data-mint-head property=\"og:title\" content=\"Import a website into Replit Design - Replit\">\u003cmeta data-mint-head property=\"og:description\" content=\"Recreate a live website as a design frame in Replit Design, then refine it with suggestions and chat, and build it into an app.\">\u003cmeta data-mint-head property=\"og:site_name\" content=\"Replit Docs\">\u003cmeta data-mint-head property=\"og:url\" content=\"https://docs.replit.com/design/import-a-website-into-replit-design\">\u003cmeta data-mint-head property=\"og:type\" content=\"website\">\u003cmeta data-mint-head property=\"og:image\" content=\"https://replit.mintlify.site/_mintlify/api/og/v2?division=Quickstart\u0026amp;title=Import+a+website+into+Replit+Design\u0026amp;description=Recreate+a+live+website+as+a+design+frame+in+Replit+Design%2C+then+refine+it+with+suggestions+and+chat%2C+and+build+it+into+an+app.\u0026amp;theme=c1942b8f9ebd95f98c5c7c23\u0026amp;signature=f60a85e285db60b79c7055419620255305e9f05974a222390f8d9c7dd99350e9\">\u003cmeta data-mint-head property=\"og:image:width\" content=\"1200\">\u003cmeta data-mint-head property=\"og:image:height\" content=\"630\">\u003cmeta data-mint-head name=\"twitter:card\" content=\"summary_large_image\">\u003cmeta data-mint-head name=\"twitter:title\" content=\"Import a website into Replit Design - Replit\">\u003cmeta data-mint-head name=\"twitter:description\" content=\"Recreate a live website as a design frame in Replit Design, then refine it with suggestions and chat, and build it into an app.\">\u003cmeta data-mint-head name=\"twitter:image\" content=\"https://replit.mintlify.site/_mintlify/api/og/v2?division=Quickstart\u0026amp;title=Import+a+website+into+Replit+Design\u0026amp;description=Recreate+a+live+website+as+a+design+frame+in+Replit+Design%2C+then+refine+it+with+suggestions+and+chat%2C+and+build+it+into+an+app.\u0026amp;theme=c1942b8f9ebd95f98c5c7c23\u0026amp;signature=f60a85e285db60b79c7055419620255305e9f05974a222390f8d9c7dd99350e9\">\u003cmeta data-mint-head name=\"twitter:image:width\" content=\"1200\">\u003cmeta data-mint-head name=\"twitter:image:height\" content=\"630\">\u003cmeta data-mint-head name=\"msapplication-config\" content=\"/mintlify-assets/_mintlify/favicons/replit/bmCuvIiWqqoyeE2o/_generated/favicon/browserconfig.xml\">\u003cmeta data-mint-head name=\"apple-mobile-web-app-title\" content=\"Replit\">\u003cmeta data-mint-head name=\"msapplication-TileColor\" content=\"#FF3C00\">\u003cmeta data-mint-head name=\"twitter:creator\" content=\"@replit\">\u003cmeta data-mint-head name=\"author\" content=\"Replit\">\u003clink data-mint-head rel=\"canonical\" href=\"https://docs.replit.com/design/import-a-website-into-replit-design\">\u003clink data-mint-head rel=\"alternate\" type=\"application/xml\" href=\"/sitemap.xml\">\u003clink data-mint-head rel=\"alternate\" type=\"text/markdown\" href=\"/design/import-a-website-into-replit-design.md\">\u003clink data-mint-head rel=\"alternate\" hreflang=\"en\" href=\"https://docs.replit.com/design/import-a-website-into-replit-design\">\u003clink data-mint-head rel=\"alternate\" hreflang=\"fr\" href=\"https://docs.replit.com/fr/design/import-a-website-into-replit-design\">\u003clink data-mint-head rel=\"alternate\" hreflang=\"pt\" href=\"https://docs.replit.com/pt/design/import-a-website-into-replit-design\">\u003clink data-mint-head rel=\"alternate\" hreflang=\"ja\" href=\"https://docs.replit.com/ja/design/import-a-website-into-replit-design\">\u003clink data-mint-head rel=\"alternate\" hreflang=\"ko\" href=\"https://docs.replit.com/ko/design/import-a-website-into-replit-design\">\u003clink data-mint-head rel=\"alternate\" hreflang=\"x-default\" href=\"https://docs.replit.com/design/import-a-website-into-replit-design\">\u003cscript data-mint-head type=\"application/ld+json\">{\"@context\":\"https://schema.org\",\"@graph\":[{\"@type\":\"Organization\",\"@id\":\"https://docs.replit.com/#organization\",\"name\":\"Replit\",\"url\":\"https://docs.replit.com\",\"logo\":{\"@type\":\"ImageObject\",\"url\":\"https://mintcdn.com/replit/j4of5To8jzehz0JK/logo/light.svg?fit=max\u0026auto=format\u0026n=j4of5To8jzehz0JK\u0026q=85\u0026s=6209cb5927b56fd1781133af05428373\"}},{\"@type\":\"WebSite\",\"@id\":\"https://docs.replit.com#website\",\"name\":\"Replit\",\"url\":\"https://docs.replit.com\",\"publisher\":{\"@id\":\"https://docs.replit.com/#organization\"}},{\"@type\":\"WebPage\",\"@id\":\"https://docs.replit.com/design/import-a-website-into-replit-design#webpage\",\"url\":\"https://docs.replit.com/design/import-a-website-into-replit-design\",\"name\":\"Import a website into Replit Design\",\"description\":\"Recreate a live website as a design frame in Replit Design, then refine it with suggestions and chat, and build it into an app.\",\"dateModified\":\"2026-07-29T15:47:19.950Z\",\"isPartOf\":{\"@id\":\"https://docs.replit.com#website\"},\"breadcrumb\":{\"@id\":\"https://docs.replit.com/design/import-a-website-into-replit-design#breadcrumb\"}},{\"@type\":\"BreadcrumbList\",\"@id\":\"https://docs.replit.com/design/import-a-website-into-replit-design#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Quickstart\",\"item\":\"https://docs.replit.com/design/design-your-first-screen\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Import a website into Replit Design\",\"item\":\"https://docs.replit.com/design/import-a-website-into-replit-design\"}]},{\"@type\":[\"Article\",\"TechArticle\"],\"@id\":\"https://docs.replit.com/design/import-a-website-into-replit-design#article\",\"headline\":\"Import a website into Replit Design\",\"name\":\"Import a website into Replit Design\",\"description\":\"Recreate a live website as a design frame in Replit Design, then refine it with suggestions and chat, and build it into an app.\",\"url\":\"https://docs.replit.com/design/import-a-website-into-replit-design\",\"mainEntityOfPage\":{\"@id\":\"https://docs.replit.com/design/import-a-website-into-replit-design#webpage\"},\"dateModified\":\"2026-07-29T15:47:19.950Z\",\"publisher\":{\"@id\":\"https://docs.replit.com/#organization\"},\"isPartOf\":{\"@id\":\"https://docs.replit.com#website\"}}]}\u003c/script>","siteName":"Replit","nav":{"global":null,"languages":[{"language":"en","tabs":[{"tab":"Home","pages":[{"title":"Home","href":"/welcome"}]},{"tab":"Chats","pages":[{"title":"Chats","href":"/chat/overview"}]},{"tab":"Apps","dropdowns":[{"dropdown":"Web","icon":"globe","pages":[{"group":"Quickstarts","pages":[{"title":"Build your first app","sidebarTitle":"Build your first app","icon":"rocket","href":"/build/your-first-app"},{"title":"Build and publish from a template","sidebarTitle":"Build from a template","icon":"palette","href":"/build/build-and-publish-from-template"},{"title":"Build with Free Mode","sidebarTitle":"Build with Free Mode","icon":"seedling","href":"/build/build-with-free-mode"},{"title":"Publish your app","sidebarTitle":"Publish your app","icon":"cloud-arrow-up","href":"/build/publish-your-app"}]},{"group":"Build paths","pages":[{"title":"Prototype a product idea","sidebarTitle":"Prototype an idea","icon":"lightbulb","href":"/build/prototype-an-idea"},{"title":"Launch a landing page","sidebarTitle":"Launch a landing page","icon":"rectangle-list","href":"/build/landing-page"},{"title":"Build a Shopify storefront","sidebarTitle":"Build a Shopify storefront","icon":"bag-shopping","href":"/build/ecommerce-store"},{"title":"Create a dashboard from data","sidebarTitle":"Create a dashboard","icon":"chart-simple","href":"/build/dashboard"},{"title":"Build a mobile app","sidebarTitle":"Build a mobile app","icon":"mobile-screen","href":"/build/mobile-app"}]},{"group":"Grow your app","pages":[{"title":"Add login","sidebarTitle":"Add login","icon":"user-lock","href":"/build/add-login"},{"title":"Add a database","sidebarTitle":"Add a database","icon":"database","href":"/build/add-database"},{"title":"Add integrations","sidebarTitle":"Add integrations","icon":"plug","href":"/build/add-integrations"},{"title":"Add a custom domain","sidebarTitle":"Add a custom domain","icon":"globe","href":"/build/add-custom-domain"}]},{"group":"Publish and operate","pages":[{"title":"Purchase a domain","sidebarTitle":"Purchase a domain","icon":"cart-shopping","href":"/build/domain-purchasing"},{"title":"Enable Feedback Widget","sidebarTitle":"Enable Feedback Widget","icon":"comment","href":"/build/enable-feedback"},{"title":"Improve your app's SEO","sidebarTitle":"Improve SEO","icon":"magnifying-glass-chart","href":"/build/improve-seo"},{"title":"Troubleshoot publishing","icon":"triangle-exclamation","href":"/build/troubleshooting"}]},{"group":"Connect \u0026 integrate","pages":[{"title":"Use Agent Skills","sidebarTitle":"Use Agent Skills","icon":"puzzle-piece","href":"/build/use-agent-skills"},{"title":"Connect via MCP","sidebarTitle":"Connect via MCP","icon":"server","href":"/build/connect-via-mcp"}]},{"group":"Collaborate","pages":[{"title":"Invite teammates","sidebarTitle":"Invite teammates","icon":"user-plus","href":"/build/invite-teammates"},{"title":"Create a team workspace","sidebarTitle":"Create a team workspace","icon":"users-rectangle","href":"/build/create-a-team-workspace"}]},{"group":"Import","pages":[{"title":"Import from a provider","sidebarTitle":"Import from a provider","icon":"file-import","href":"/build/import-from-providers"}]}]},{"dropdown":"Mobile","icon":"mobile","groups":[{"group":"Quickstarts","pages":[{"title":"Start your first mobile app","sidebarTitle":"Start your mobile app","icon":"wand-magic-sparkles","href":"/build/mobile-first-app"},{"title":"Preview and test on your phone","sidebarTitle":"Test with Expo Go","icon":"mobile","href":"/build/mobile-preview-testing"}]},{"group":"Publish for iOS","pages":[{"title":"Set up your Apple Developer account","sidebarTitle":"Set up your account","icon":"apple","href":"/build/mobile-apple-account"},{"title":"Upload your app to App Store Connect","sidebarTitle":"Upload your app","icon":"cloud-arrow-up","href":"/build/mobile-upload-ios"},{"title":"Beta test with TestFlight","sidebarTitle":"Test on TestFlight","icon":"flask","href":"/build/mobile-testflight"},{"title":"Submit to the App Store","sidebarTitle":"Submit for App Store","icon":"paper-plane","href":"/build/mobile-publish-ios"}]},{"group":"Add features and grow your app","pages":[{"title":"Add login","sidebarTitle":"Add login","icon":"right-to-bracket","href":"/build/mobile-login"},{"title":"Add payments with RevenueCat","sidebarTitle":"Add payments","icon":"credit-card","href":"/build/mobile-payments"},{"title":"Store images in your mobile app","sidebarTitle":"Save player images","icon":"image","href":"/build/mobile-store-images"},{"title":"Add haptics","sidebarTitle":"Add haptics","icon":"wave-square","href":"/build/mobile-haptics"},{"title":"Use iOS native components","sidebarTitle":"Use native UI","icon":"apple","href":"/build/mobile-native-components"},{"title":"Use the camera","sidebarTitle":"Add camera","icon":"camera","href":"/build/mobile-camera"},{"title":"Access contacts","sidebarTitle":"Add contacts","icon":"address-book","href":"/build/mobile-contacts"},{"title":"Send push notifications","sidebarTitle":"Send notifications","icon":"bell","href":"/build/mobile-push-notifications"},{"title":"Collect reviews and ratings","sidebarTitle":"Collect reviews","icon":"star","href":"/build/mobile-collect-reviews"}]},{"group":"Design","pages":[{"title":"Design your app","sidebarTitle":"Design your app","icon":"palette","href":"/build/mobile-design"},{"title":"Generate an app icon","sidebarTitle":"Generate app icon","icon":"image","href":"/build/mobile-app-icon"},{"title":"Generate App Store screenshots","sidebarTitle":"Generate store assets","icon":"images","href":"/build/mobile-store-screenshots"}]},{"group":"Collaborate","pages":[{"title":"Build PixelGames with a team","sidebarTitle":"Invite your team","icon":"users","href":"/build/mobile-invite-team"}]}]}]},{"tab":"Code","pages":[{"title":"Code","href":"/build/code/code-with-replit"}]},{"tab":"Designs","groups":[{"group":"Replit Design","pages":[{"title":"What is Replit Design","sidebarTitle":"What is Replit Design","icon":"palette","href":"/design/what-is-replit-design"},{"title":"Design vs. Build","sidebarTitle":"Design vs. Build","icon":"code-compare","href":"/design/design-vs-build"}]},{"group":"Quickstart","pages":[{"title":"Design your first screen","icon":"rocket","href":"/design/design-your-first-screen"},{"title":"Start from a template","icon":"layer-group","href":"/design/start-from-a-template"},{"title":"Import Figma designs into Replit Design","sidebarTitle":"Import from Figma","icon":"pen-ruler","href":"/design/import-figma-designs-into-replit-design"},{"title":"Import Claude designs into Replit Design","sidebarTitle":"Import from Claude","description":"Send a design from Claude to Replit, create a project from the static HTML, and let Agent turn it into an interactive app.","icon":"file-import","href":"/design/import-claude-designs-into-replit-design"},{"title":"Import a website into Replit Design","sidebarTitle":"Import from URL","icon":"link","href":"/design/import-a-website-into-replit-design"}]},{"group":"Core components","pages":[{"title":"Replit Design components","sidebarTitle":"Overview","description":"Meet the building blocks of Replit Design: Canvas, frames, elements, chat, ambient intelligence, the toolbar, and the library panel, and how they fit together.","icon":"layer-group","href":"/design/core-components"},{"title":"Canvas","sidebarTitle":"Canvas","icon":"object-group","href":"/design/canvas"},{"title":"Frames","sidebarTitle":"Frames","icon":"square-dashed","href":"/design/frames"},{"title":"Elements","sidebarTitle":"Elements","icon":"object-ungroup","href":"/design/elements"},{"title":"Toolbar","sidebarTitle":"Toolbar","icon":"toolbox","href":"/design/toolbar"},{"title":"Library panel","icon":"images","href":"/design/library-panel"}]},{"group":"Explore","pages":[{"title":"Explore","sidebarTitle":"Overview","icon":"compass","href":"/design/explore"},{"title":"Explore suggestions","icon":"lightbulb","href":"/design/explore-suggestions"},{"title":"Explore with different models","sidebarTitle":"Explore with models","icon":"microchip","href":"/design/explore-with-different-models"},{"title":"Add templates and inspiration to your design","sidebarTitle":"Templates \u0026 inspiration","icon":"shapes","href":"/design/add-templates-and-inspiration"}]},{"group":"Refine","pages":[{"title":"Refine","sidebarTitle":"Overview","icon":"sliders","href":"/design/refine"},{"title":"Chat about your design","sidebarTitle":"Chat","icon":"comments","href":"/design/chat-about-your-design"},{"title":"Visual Editor","sidebarTitle":"Visual Editor","icon":"pen-to-square","href":"/design/visual-editor"}]},{"group":"Build","pages":[{"title":"Build your design","sidebarTitle":"Build your design","icon":"rocket","href":"/design/build-your-design"}]},{"group":"Design systems","pages":[{"title":"Design systems, explained","icon":"swatchbook","href":"/design/design-systems-explained"},{"title":"Create a design system","icon":"droplet","href":"/design/create-a-design-system"},{"title":"Design system contents and DESIGN.md","icon":"file-lines","href":"/design/design-md"},{"title":"Apply a design system to an existing app","icon":"paint-roller","href":"/design/apply-design-system"}]}]},{"tab":"Use cases","pages":[{"title":"Use cases","href":"/use-cases"}]},{"tab":"Learn","pages":[{"title":"Learn","href":"/learn/foundations/what-is-an-app"}]},{"tab":"Features","pages":[{"title":"Features","href":"/features/collaboration/workspaces"}]},{"tab":"Trust \u0026 Billing","pages":[{"title":"Trust \u0026 Billing","href":"/category/billing"}]},{"tab":"Enterprise","pages":[{"title":"Enterprise","href":"/teams/welcome"}]}]},{"language":"fr","navbar":{"links":[],"primary":{"type":"button","label":"Commencer à créer","href":"https://replit.com?ref=docs"}},"pages":[{"title":"fr","href":"/fr/design/import-a-website-into-replit-design"}]},{"language":"pt","navbar":{"links":[],"primary":{"type":"button","label":"Comece a criar","href":"https://replit.com?ref=docs"}},"hidden":false,"pages":[{"title":"pt","href":"/pt/design/import-a-website-into-replit-design"}]},{"language":"ja","navbar":{"links":[],"primary":{"type":"button","label":"作成を開始","href":"https://replit.com?ref=docs"}},"hidden":false,"pages":[{"title":"ja","href":"/ja/design/import-a-website-into-replit-design"}]},{"language":"ko","navbar":{"links":[],"primary":{"type":"button","label":"빌드 시작하기","href":"https://replit.com?ref=docs"}},"hidden":false,"pages":[{"title":"ko","href":"/ko/design/import-a-website-into-replit-design"}]}]},"basePath":"","title":"Import a website into Replit Design - Replit","buildId":"dpl_FWZhTb2vab28gFGFH4ojka6qEznQ","deploymentId":"dpl_FWZhTb2vab28gFGFH4ojka6qEznQ","dynamics":["07c022d89b","a74be98ba7"],"chunks":["Frame-CXMGc493.js","DynamicMarkdown-D-2HDKEp.js","zoom-image-lightbox-CE4cYsJE.js","lightbox-handle-r17bVUz3.js"]}