Stop Houzz from Turning Your PNG's Backgrounds White! (Image Upload Workaround)

Are your transparent icons turning white when you upload them to the Houzz Website Builder? You aren't alone! In this video, Kelly Barkhurst from Designer to Full Stack explains why the Houzz framework converts PNGs to JPEGs and how to use a simple Adobe Illustrator workaround to get a seamless, professional look for your construction or design website. In this video, you'll learn: -- Houzz doesn't support SVG or true PNG transparency in certain sections. -- How to identify "Framework Conversion" using the Inspect tool. -- The step-by-step workflow in Illustrator to create "Color-Matched" JPEGs. -- Tips for image SEO and keyword-rich naming conventions. TIMESTAMPS 0:00 Introduction: Working with Platform Constraints 0:25 The Problem: Why is my PNG background white? 0:54 The Technical Why: PNG to JPEG Conversion 1:38 SVGs aren't an option on Houzz 2:12 The Workaround: Creating "Seamless" JPEGs 2:38 Setting up Artboards in Adobe Illustrator 3:12 Aligning icons for a perfect fit 3:35 Exporting with keyword-rich filenames 4:15 Uploading to Houzz and adding Alt Text 5:05 Hard Refresh & Final Results 5:34 Troubleshooting other website builders 🔗 Resources Mentioned: Visit the blog for the full write-up: https://designertofullstack.com/the-hidden-image-constraint-how-to-fix-white-backgrounds-in-the-houzz-website-builder/ #HouzzPro #WebsiteBuilder #WebDesignTips #GraphicDesign Workaround #HouzzWebsite #DesignerToFullStack #SEOtips _____________________________________________________________ *JOIN MY EMAIL LIST* Love quick, helpful tutorials? You’ll love the emails too. 💌 https://designertofullstack.com/join-the-list/ *ABOUT ME* Hello, world. I’m *Kelly Barkhurst* —an experienced Mac-based full-stack designer, educator, and entrepreneur passionately blending artistic vision and creativity with deep technical expertise. With a BFA and MFA in Graphic Design and a certificate in Full-Stack Web Development, I’m uniquely positioned to work at this intersection of design and tech. My driving force is creating meaningful solutions and helping clients and students do the same. *What’s Kelly’s superpower?* It’s using design thinking to strategically plan the BIG picture, then diving deep into the technical “weeds” to bring that vision to life—through beautiful visual design, compelling writing, or well-crafted, functional code. *What brought you JOY today? * 👇 Share in the comments below *SOCIALS* https://twitter.com/@designer2fstack https://www.facebook.com/designertofullstack https://www.youtube.com/@UCWk0aZ-yFzCQX5bMLaISrog