{"id":7169,"date":"2022-07-01T07:54:45","date_gmt":"2022-07-01T07:54:45","guid":{"rendered":"https:\/\/www.cldy.com\/support\/?post_type=docs&#038;p=7169"},"modified":"2022-07-03T13:40:29","modified_gmt":"2022-07-03T13:40:29","password":"","slug":"what-are-the-recommended-image-size-in-divi-builder","status":"publish","type":"docs","link":"https:\/\/www.cldy.com\/support\/help\/what-are-the-recommended-image-size-in-divi-builder\/","title":{"rendered":"What are the recommended Image Sizes in Divi builder?"},"content":{"rendered":"<p><span style=\"font-weight: 400;\">There are many advantages to optimizing your images to the recommended size. These include improved page loading speed and SEO ranking as well as the use of lesser hosting bandwidth.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">While the list goes on for the positive usage of recommended images, we\u2019re here to show you how to choose the right image size for Divi, how to optimize them prior to upload, and how to make sure they are added to your site correctly.\u00a0<\/span><\/p>\n<p>&nbsp;<\/p>\n<h3><b>Three Aspect Ratios<\/b><\/h3>\n<p><span style=\"font-weight: 400;\">Take note of these three aspect ratios when it comes to uploading images on Divi.\u00a0<\/span><\/p>\n<ul>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">16:9\u00a0<\/span>\n<ul>\n<li style=\"font-weight: 400;\" aria-level=\"2\"><span style=\"font-weight: 400;\">1080 px by 608 px*<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"2\"><span style=\"font-weight: 400;\">795 px by 448 px<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"2\"><span style=\"font-weight: 400;\">700 px by 395 px<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"2\"><span style=\"font-weight: 400;\">510 px by 288px<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"2\"><span style=\"font-weight: 400;\">320 px by 181 px<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"2\"><span style=\"font-weight: 400;\">225 px by 128 px<\/span><\/li>\n<\/ul>\n<\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">4:3<\/span>\n<ul>\n<li style=\"font-weight: 400;\" aria-level=\"2\"><span style=\"font-weight: 400;\">1080 px by 810 px<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"2\"><span style=\"font-weight: 400;\">795 px by 597 px<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"2\"><span style=\"font-weight: 400;\">700 px by 526 px<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"2\"><span style=\"font-weight: 400;\">510 px by 384 px<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"2\"><span style=\"font-weight: 400;\">320 px by 241 px<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"2\"><span style=\"font-weight: 400;\">225 px by 170 px<\/span><\/li>\n<\/ul>\n<\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">3:4<\/span>\n<ul>\n<li style=\"font-weight: 400;\" aria-level=\"2\"><span style=\"font-weight: 400;\">810 px by 1080 px<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"2\"><span style=\"font-weight: 400;\">597 px by 795 px<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"2\"><span style=\"font-weight: 400;\">526 px by 700 px<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"2\"><span style=\"font-weight: 400;\">384 px by 510 px<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"2\"><span style=\"font-weight: 400;\">241 px by 320 px<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"2\"><span style=\"font-weight: 400;\">170 px by 225 px<\/span><span style=\"font-weight: 400;\"><br \/>\n<\/span><\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<h3><b>Module Images<\/b><\/h3>\n<p><span style=\"font-weight: 400;\">For blurb or menu images, take note that the maximum size should be 550 px by 310 px.<\/span><\/p>\n<p><span style=\"font-weight: 400;\">You can adjust it accordingly depending on the layout, as follows:<\/span><\/p>\n<ul>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">1 column: 550px<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">\u00bd column: 510px<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">\u2153 column: 320px<\/span><\/li>\n<li style=\"font-weight: 400;\" aria-level=\"1\"><span style=\"font-weight: 400;\">\u00bc column: 225px<\/span><\/li>\n<\/ul>\n<p>&nbsp;<\/p>\n<h3><b>Slider or Carousel Images<\/b><\/h3>\n<p><span style=\"font-weight: 400;\">When setting up a carousel for featured images, the recommended size for the photos should be 1500 px by 844 px.<\/span><\/p>\n<p>&nbsp;<\/p>\n<h3><b>Testimonial Images<\/b><\/h3>\n<p><span style=\"font-weight: 400;\">If you are featuring testimonials and photos from your customers, keep it to 90 px by 90 px, or a 1:1 aspect ratio.<\/span><\/p>\n<p>&nbsp;<\/p>\n<p><span style=\"font-weight: 400;\">While there are no one-size-fits-all images in Divi, the sizes we recommended should be treated as a general guideline.\u00a0<\/span><\/p>\n<p><span style=\"font-weight: 400;\">Remember that optimizing your images before uploading results in faster websites and better SEO performance. Now that you know how to do this, go out and try it for yourself!\u00a0<\/span><\/p>\n<p>&nbsp;<\/p>\n<p><i><span style=\"font-weight: 400;\">* px is for pixels<\/span><\/i><\/p>\n","protected":false},"excerpt":{"rendered":"<p>There are many advantages to optimizing your images to the recommended size. These include improved page loading speed and SEO ranking as well as the use of lesser hosting bandwidth.\u00a0 While the list goes on for the positive usage of recommended images, we\u2019re here to show you how to choose the right image size for [&hellip;]<\/p>\n","protected":false},"author":5,"featured_media":0,"comment_status":"open","ping_status":"closed","template":"","meta":{"footnotes":""},"doc_category":[54],"doc_tag":[],"class_list":["post-7169","docs","type-docs","status-publish","hentry","doc_category-15-min-website"],"year_month":"2026-07","word_count":288,"total_views":0,"reactions":{"happy":0,"normal":0,"sad":0},"author_info":{"name":"syd123","author_nicename":"syd123","author_url":"https:\/\/www.cldy.com\/support\/author\/syd123\/"},"doc_category_info":[{"term_name":"15 Min Website","term_url":"https:\/\/www.cldy.com\/support\/help-category\/15-min-website\/"}],"doc_tag_info":[],"_links":{"self":[{"href":"https:\/\/www.cldy.com\/support\/wp-json\/wp\/v2\/docs\/7169","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.cldy.com\/support\/wp-json\/wp\/v2\/docs"}],"about":[{"href":"https:\/\/www.cldy.com\/support\/wp-json\/wp\/v2\/types\/docs"}],"author":[{"embeddable":true,"href":"https:\/\/www.cldy.com\/support\/wp-json\/wp\/v2\/users\/5"}],"replies":[{"embeddable":true,"href":"https:\/\/www.cldy.com\/support\/wp-json\/wp\/v2\/comments?post=7169"}],"version-history":[{"count":5,"href":"https:\/\/www.cldy.com\/support\/wp-json\/wp\/v2\/docs\/7169\/revisions"}],"predecessor-version":[{"id":7479,"href":"https:\/\/www.cldy.com\/support\/wp-json\/wp\/v2\/docs\/7169\/revisions\/7479"}],"wp:attachment":[{"href":"https:\/\/www.cldy.com\/support\/wp-json\/wp\/v2\/media?parent=7169"}],"wp:term":[{"taxonomy":"doc_category","embeddable":true,"href":"https:\/\/www.cldy.com\/support\/wp-json\/wp\/v2\/doc_category?post=7169"},{"taxonomy":"doc_tag","embeddable":true,"href":"https:\/\/www.cldy.com\/support\/wp-json\/wp\/v2\/doc_tag?post=7169"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}