[{"data":1,"prerenderedAt":334},["ShallowReactive",2],{"blog-guides/framer":3},{"id":4,"title":5,"body":6,"category":309,"date":310,"dateModified":310,"description":311,"draft":312,"extension":313,"faq":314,"featured":312,"headerVariant":318,"image":319,"keywords":319,"meta":320,"navigation":321,"ogDescription":322,"ogTitle":323,"path":324,"readTime":325,"schemaOrg":326,"schemaType":327,"seo":328,"sitemap":329,"stem":330,"tags":331,"twitterCard":332,"__hash__":333},"blog/blog/guides/framer.md","Framer Security Guide: Design-to-Code Protection",{"type":7,"value":8,"toc":291},"minimark",[9,16,21,24,53,57,60,65,79,88,92,106,110,113,127,131,134,138,164,168,182,186,200,204,207,232,260,279],[10,11,12],"tldr",{},[13,14,15],"p",{},"Framer handles hosting security automatically with SSL and CDN. Be careful with custom code components and third-party scripts. Framer is great for marketing sites but needs additional services for user authentication or sensitive data handling. Review any embedded code before adding it to your site.",[17,18,20],"h2",{"id":19},"what-framer-handles","What Framer Handles",[13,22,23],{},"Framer provides solid infrastructure security:",[25,26,27,35,41,47],"ul",{},[28,29,30,34],"li",{},[31,32,33],"strong",{},"Automatic SSL:"," HTTPS for all sites",[28,36,37,40],{},[31,38,39],{},"Global CDN:"," Fast, distributed hosting",[28,42,43,46],{},[31,44,45],{},"Managed hosting:"," No server configuration needed",[28,48,49,52],{},[31,50,51],{},"DDoS protection:"," Built into infrastructure",[17,54,56],{"id":55},"custom-code-security","Custom Code Security",[13,58,59],{},"Framer allows custom React components and code overrides:",[61,62,64],"h3",{"id":63},"code-override-risks","Code Override Risks",[25,66,67,70,73,76],{},[28,68,69],{},"Code runs in the browser with full page access",[28,71,72],{},"Can access cookies, local storage, and page content",[28,74,75],{},"Third-party code can be malicious",[28,77,78],{},"Review all custom code before publishing",[80,81,82],"warning-box",{},[13,83,84,87],{},[31,85,86],{},"Warning:"," Only add custom code from sources you trust. Free code snippets from unknown sources may contain malicious scripts that steal data or hijack your site.",[61,89,91],{"id":90},"best-practices-for-custom-code","Best Practices for Custom Code",[25,93,94,97,100,103],{},[28,95,96],{},"Review code before adding it",[28,98,99],{},"Understand what external services it connects to",[28,101,102],{},"Check if it stores or transmits data",[28,104,105],{},"Keep third-party libraries updated",[17,107,109],{"id":108},"forms-and-data-collection","Forms and Data Collection",[13,111,112],{},"When using forms in Framer:",[25,114,115,118,121,124],{},[28,116,117],{},"Use trusted form services (Formspree, Typeform, etc.)",[28,119,120],{},"Don't collect sensitive data without proper handling",[28,122,123],{},"Consider what data is stored and where",[28,125,126],{},"Add spam protection (reCAPTCHA)",[17,128,130],{"id":129},"third-party-integrations","Third-Party Integrations",[13,132,133],{},"Many Framer sites use external services:",[61,135,137],{"id":136},"common-integrations","Common Integrations",[25,139,140,146,152,158],{},[28,141,142,145],{},[31,143,144],{},"Analytics:"," Use trusted providers (Google Analytics, Plausible)",[28,147,148,151],{},[31,149,150],{},"Forms:"," Formspree, Typeform, etc.",[28,153,154,157],{},[31,155,156],{},"Payments:"," Use proper services like Stripe",[28,159,160,163],{},[31,161,162],{},"Chat widgets:"," Review their data practices",[61,165,167],{"id":166},"integration-security","Integration Security",[25,169,170,173,176,179],{},[28,171,172],{},"Each integration adds potential risk",[28,174,175],{},"Review what data each service collects",[28,177,178],{},"Check for security certifications (SOC 2, etc.)",[28,180,181],{},"Remove integrations you don't use",[17,183,185],{"id":184},"account-security","Account Security",[25,187,188,191,194,197],{},[28,189,190],{},"Use a strong, unique password",[28,192,193],{},"Enable two-factor authentication if available",[28,195,196],{},"Review team access regularly",[28,198,199],{},"Be careful with edit links and sharing",[17,201,203],{"id":202},"when-you-need-more","When You Need More",[13,205,206],{},"Framer is great for marketing sites. For more complex needs:",[25,208,209,215,221,226],{},[28,210,211,214],{},[31,212,213],{},"User authentication:"," Use dedicated services",[28,216,217,220],{},[31,218,219],{},"Database:"," Connect to backend services",[28,222,223,225],{},[31,224,156],{}," Use proper payment processors",[28,227,228,231],{},[31,229,230],{},"Sensitive data:"," Use a proper backend",[233,234,235,242,248,254],"faq-section",{},[236,237,239],"faq-item",{"question":238},"Is Framer secure for production websites?",[13,240,241],{},"Yes. Framer provides automatic SSL, global CDN hosting, and managed infrastructure. For marketing sites and portfolios, Framer's security is solid. For applications with user data, you'll need to add backend services.",[236,243,245],{"question":244},"Can I add security headers in Framer?",[13,246,247],{},"Framer provides some control over headers through site settings. For more advanced header configuration, consider using a reverse proxy like Cloudflare in front of your Framer site.",[236,249,251],{"question":250},"Is custom code in Framer safe?",[13,252,253],{},"Custom code runs in the browser and can access your page content. Only use code from trusted sources. Review any third-party scripts before adding them to your site. Malicious code can steal data or redirect users.",[236,255,257],{"question":256},"Should I worry about XSS in Framer?",[13,258,259],{},"Framer's built-in components are safe. Risk comes from custom code and third-party integrations. Review any code that handles user input to ensure it doesn't introduce XSS vulnerabilities.",[261,262,263,269,274],"related-articles",{},[264,265],"related-card",{"description":266,"href":267,"title":268},"Similar platform comparison","/blog/guides/webflow","Webflow Security Guide",[264,270],{"description":271,"href":272,"title":273},"Code-based hosting option","/blog/guides/vercel","Vercel Security Guide",[264,275],{"description":276,"href":277,"title":278},"No-code app security","/blog/guides/bubble","Bubble Security Guide",[280,281,284,288],"cta-box",{"href":282,"label":283},"/","Start Free Scan",[17,285,287],{"id":286},"building-with-framer","Building with Framer?",[13,289,290],{},"Review your site's security configuration.",{"title":292,"searchDepth":293,"depth":293,"links":294},"",2,[295,296,301,302,306,307,308],{"id":19,"depth":293,"text":20},{"id":55,"depth":293,"text":56,"children":297},[298,300],{"id":63,"depth":299,"text":64},3,{"id":90,"depth":299,"text":91},{"id":108,"depth":293,"text":109},{"id":129,"depth":293,"text":130,"children":303},[304,305],{"id":136,"depth":299,"text":137},{"id":166,"depth":299,"text":167},{"id":184,"depth":293,"text":185},{"id":202,"depth":293,"text":203},{"id":286,"depth":293,"text":287},"guides","2026-01-23","Security guide for Framer users. Learn about site security, custom code safety, and protecting your Framer websites from common vulnerabilities.",false,"md",[315,316,317],{"question":238,"answer":241},{"question":244,"answer":247},{"question":250,"answer":253},"blue",null,{},true,"How to secure your Framer website with proper configuration and code practices.","Framer Security Guide","/blog/guides/framer","5 min read","[object Object]","BlogPosting",{"title":5,"description":311},{"loc":324},"blog/guides/framer",[],"summary_large_image","KG_4r3QcFaLKvMHx-Ct5kzNTB7QfUas-efniI7i1wJU",1775843930060]