{"id":813,"date":"2020-05-12T15:02:52","date_gmt":"2020-05-12T15:02:52","guid":{"rendered":"https:\/\/sweepwidget.com\/docs\/?p=813"},"modified":"2026-01-18T19:54:44","modified_gmt":"2026-01-18T19:54:44","slug":"add-a-background-color-to-your-hosted-landing-page","status":"publish","type":"post","link":"https:\/\/sweepwidget.com\/docs\/add-a-background-color-to-your-hosted-landing-page","title":{"rendered":"Add A Background Color To Your Hosted Landing Page"},"content":{"rendered":"\n<p>Customize your hosted landing page by adding a background color that matches your brand. This simple change can make your giveaway look more professional and visually appealing to participants.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Why Add a Background Color?<\/strong><\/h2>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Brand consistency<\/strong> &#8211; Match your giveaway to your brand colors<\/li>\n\n\n\n<li><strong>Visual appeal<\/strong> &#8211; Create a more polished, professional appearance<\/li>\n\n\n\n<li><strong>Stand out<\/strong> &#8211; Differentiate your giveaway from the default white background<\/li>\n\n\n\n<li><strong>Complement your design<\/strong> &#8211; Coordinate with your header image and widget colors<\/li>\n<\/ul>\n\n\n\n<p><strong>Note:<\/strong> The background color applies to <strong>hosted landing pages<\/strong> (sweepwidget.com\/c\/your-giveaway). If you embed the widget on your own website, your site&#8217;s background will be used instead.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>How to Add a Background Color<\/strong><\/h2>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Step 1: Go to Design Settings<\/strong><\/h3>\n\n\n\n<ol class=\"wp-block-list\">\n<li>Create or edit a giveaway<\/li>\n\n\n\n<li>Click on the <strong>Design<\/strong> tab in the left sidebar<\/li>\n\n\n\n<li>Find the <strong>Add a background image or color to your landing page<\/strong> section<\/li>\n<\/ol>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Step 2: Select the Color Option<\/strong><\/h3>\n\n\n\n<p>You&#8217;ll see two options:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Image<\/strong> &#8211; Upload a background image<\/li>\n\n\n\n<li><strong>Color<\/strong> &#8211; Set a solid background color<\/li>\n<\/ul>\n\n\n\n<p>Select <strong>Color<\/strong> to enable the background color option.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img fetchpriority=\"high\" decoding=\"async\" width=\"1024\" height=\"576\" src=\"https:\/\/sweepwidget.com\/docs\/wp-content\/uploads\/2020\/05\/background-color-1-1024x576.png\" alt=\"\" class=\"wp-image-7405\" srcset=\"https:\/\/sweepwidget.com\/docs\/wp-content\/uploads\/2020\/05\/background-color-1-1024x576.png 1024w, https:\/\/sweepwidget.com\/docs\/wp-content\/uploads\/2020\/05\/background-color-1-300x169.png 300w, https:\/\/sweepwidget.com\/docs\/wp-content\/uploads\/2020\/05\/background-color-1-768x432.png 768w, https:\/\/sweepwidget.com\/docs\/wp-content\/uploads\/2020\/05\/background-color-1.png 1500w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Step 3: Choose Your Color<\/strong><\/h3>\n\n\n\n<p>Click on the color swatch dropdown to open the color picker.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"1024\" height=\"575\" src=\"https:\/\/sweepwidget.com\/docs\/wp-content\/uploads\/2020\/05\/background-color-2-1024x575.png\" alt=\"\" class=\"wp-image-7406\" srcset=\"https:\/\/sweepwidget.com\/docs\/wp-content\/uploads\/2020\/05\/background-color-2-1024x575.png 1024w, https:\/\/sweepwidget.com\/docs\/wp-content\/uploads\/2020\/05\/background-color-2-300x169.png 300w, https:\/\/sweepwidget.com\/docs\/wp-content\/uploads\/2020\/05\/background-color-2-768x432.png 768w, https:\/\/sweepwidget.com\/docs\/wp-content\/uploads\/2020\/05\/background-color-2.png 1500w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Color Picker Features<\/strong><\/h2>\n\n\n\n<p>The color picker provides multiple ways to select your perfect color:<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Preset Color Swatches<\/strong><\/h3>\n\n\n\n<p>On the left side of the color picker, you&#8217;ll find a grid of preset colors. These include:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Basic colors (black, white, grays)<\/li>\n\n\n\n<li>Primary colors (red, blue, yellow, green)<\/li>\n\n\n\n<li>Pastel shades<\/li>\n\n\n\n<li>Bold and vibrant options<\/li>\n<\/ul>\n\n\n\n<p>Click any swatch to instantly select that color.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Gradient Color Picker<\/strong><\/h3>\n\n\n\n<p>On the right side, you&#8217;ll find an advanced color selector with:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Color gradient area<\/strong> &#8211; Click anywhere to select a specific shade and saturation<\/li>\n\n\n\n<li><strong>Hue slider<\/strong> &#8211; The vertical rainbow bar lets you change the base color<\/li>\n\n\n\n<li><strong>Preview swatch<\/strong> &#8211; Shows your currently selected color<\/li>\n<\/ul>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Hex Color Input<\/strong><\/h3>\n\n\n\n<p>Below the gradient picker, you can enter a specific hex color code (e.g., <code>#fce5cd<\/code>). This is useful when you need to match an exact brand color.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Confirming Your Selection<\/strong><\/h3>\n\n\n\n<p>After selecting your color:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Click <strong>choose<\/strong> to apply the color<\/li>\n\n\n\n<li>Click <strong>cancel<\/strong> to close without changes<\/li>\n<\/ul>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>What Participants See<\/strong><\/h2>\n\n\n\n<p>On your hosted landing page, the background color fills the entire page behind the giveaway widget.<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img decoding=\"async\" width=\"1024\" height=\"578\" src=\"https:\/\/sweepwidget.com\/docs\/wp-content\/uploads\/2020\/05\/background-color-3-1024x578.png\" alt=\"\" class=\"wp-image-7407\" srcset=\"https:\/\/sweepwidget.com\/docs\/wp-content\/uploads\/2020\/05\/background-color-3-1024x578.png 1024w, https:\/\/sweepwidget.com\/docs\/wp-content\/uploads\/2020\/05\/background-color-3-300x169.png 300w, https:\/\/sweepwidget.com\/docs\/wp-content\/uploads\/2020\/05\/background-color-3-768x434.png 768w, https:\/\/sweepwidget.com\/docs\/wp-content\/uploads\/2020\/05\/background-color-3.png 1500w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p>The widget itself remains white (or your customized widget colors), creating contrast against your chosen background.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Background Color vs. Background Image<\/strong><\/h2>\n\n\n\n<figure class=\"wp-block-table\"><table><thead><tr><th>Option<\/th><th>Best For<\/th><th>Considerations<\/th><\/tr><\/thead><tbody><tr><td><strong>Color<\/strong><\/td><td>Clean, simple designs; fast loading<\/td><td>Solid color only; no patterns or gradients<\/td><\/tr><tr><td><strong>Image<\/strong><\/td><td>Rich visuals; promotional graphics<\/td><td>Larger file size; may affect load time<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n<p>You can only choose one &#8211; either a background color OR a background image, not both.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Color Recommendations<\/strong><\/h2>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Popular Background Color Choices<\/strong><\/h3>\n\n\n\n<figure class=\"wp-block-table\"><table><thead><tr><th>Color Type<\/th><th>Example Hex Codes<\/th><th>Best For<\/th><\/tr><\/thead><tbody><tr><td><strong>Light neutrals<\/strong><\/td><td>#f5f5f5, #fafafa, #f0f0f0<\/td><td>Clean, professional look<\/td><\/tr><tr><td><strong>Soft pastels<\/strong><\/td><td>#fce5cd, #d9ead3, #cfe2f3<\/td><td>Friendly, approachable feel<\/td><\/tr><tr><td><strong>Brand colors<\/strong><\/td><td>Your brand&#8217;s primary color<\/td><td>Strong brand recognition<\/td><\/tr><tr><td><strong>Dark colors<\/strong><\/td><td>#333333, #2c3e50, #1a1a2e<\/td><td>Bold, dramatic effect<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\"><strong>Tips for Choosing Colors<\/strong><\/h3>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Ensure readability<\/strong> &#8211; The widget has a white background, so most colors work well<\/li>\n\n\n\n<li><strong>Match your brand<\/strong> &#8211; Use your brand&#8217;s secondary or accent colors<\/li>\n\n\n\n<li><strong>Consider contrast<\/strong> &#8211; Your custom logo should be visible against the background<\/li>\n\n\n\n<li><strong>Test on mobile<\/strong> &#8211; Preview how the color looks on smaller screens<\/li>\n\n\n\n<li><strong>Avoid overly bright colors<\/strong> &#8211; Neon or extremely saturated colors can be hard on the eyes<\/li>\n<\/ul>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Best Practices<\/strong><\/h2>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Use hex codes for precision<\/strong> &#8211; If you have specific brand colors, enter the exact hex code<\/li>\n\n\n\n<li><strong>Coordinate with other design elements<\/strong> &#8211; Consider your header image, button colors, and logo<\/li>\n\n\n\n<li><strong>Keep it subtle<\/strong> &#8211; Soft, muted colors often look more professional than bold, bright ones<\/li>\n\n\n\n<li><strong>Preview before publishing<\/strong> &#8211; Check the live preview to see how your color looks<\/li>\n\n\n\n<li><strong>Consider accessibility<\/strong> &#8211; Ensure sufficient contrast for users with visual impairments<\/li>\n<\/ul>\n\n\n\n<h2 class=\"wp-block-heading\"><strong>Combining with Other Design Features<\/strong><\/h2>\n\n\n\n<p>Background colors work well when combined with other design customizations:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li><strong>Custom logo<\/strong> &#8211; Add your brand logo above the widget<\/li>\n\n\n\n<li><strong>Header image<\/strong> &#8211; Include a promotional image inside the widget<\/li>\n\n\n\n<li><strong>Widget colors<\/strong> &#8211; Customize button colors and fonts to match<\/li>\n\n\n\n<li><strong>Custom CSS<\/strong> &#8211; Advanced users can add additional styling<\/li>\n<\/ul>\n","protected":false},"excerpt":{"rendered":"<p>Customize your hosted landing page by adding a background color that matches your brand. This simple change can make your giveaway look more professional and visually appealing to participants. Why Add a Background Color? Note: The background color applies to hosted landing pages (sweepwidget.com\/c\/your-giveaway). If you embed the widget on your own website, your site&#8217;s background will be used instead. How to Add a Background Color Step 1: Go to Design Settings Step 2: Select the Color Option You&#8217;ll see two options: Select Color to enable the background color option. Step 3: Choose Your Color Click on the color swatch dropdown to open the color picker. Color Picker Features The color picker provides multiple ways to select your perfect color: Preset Color Swatches On the left side of the color picker, you&#8217;ll find a grid of preset colors. These include: Click any swatch to instantly select that color. Gradient Color Picker On the right side, you&#8217;ll find an advanced color selector with: Hex Color Input Below the gradient picker, you can enter a specific hex color code (e.g., #fce5cd). This is useful when you need to match an exact brand color. Confirming Your Selection After selecting your color: What Participants See On your hosted landing page, the background color fills the entire page behind the giveaway widget. The widget itself remains white (or your customized widget colors), creating contrast against your chosen background. Background Color vs. Background Image Option Best For Considerations Color Clean, simple designs; fast loading Solid color only; no patterns or gradients Image Rich visuals; promotional graphics Larger file size; may affect load time You can only choose one &#8211; either a background color OR a background image, not both. Color Recommendations Popular Background Color Choices Color Type Example Hex Codes Best For Light neutrals #f5f5f5, #fafafa, #f0f0f0 Clean, professional look Soft pastels #fce5cd, #d9ead3, #cfe2f3 Friendly, approachable feel Brand colors Your brand&#8217;s primary color Strong brand recognition Dark colors #333333, #2c3e50, #1a1a2e Bold, dramatic effect Tips for Choosing Colors Best Practices Combining with Other Design Features Background colors work well when combined with other design customizations:<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[71],"tags":[],"class_list":["post-813","post","type-post","status-publish","format-standard","hentry","category-design"],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v27.3 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Add A Background Color To Your Hosted Landing Page | SweepWidget<\/title>\n<meta name=\"description\" content=\"Learn how to add a background color to SweepWidget giveaway on your hosted landing page.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/sweepwidget.com\/docs\/add-a-background-color-to-your-hosted-landing-page\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Add A Background Color To Your Hosted Landing Page | SweepWidget\" \/>\n<meta property=\"og:description\" content=\"Learn how to add a background color to SweepWidget giveaway on your hosted landing page.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/sweepwidget.com\/docs\/add-a-background-color-to-your-hosted-landing-page\" \/>\n<meta property=\"og:site_name\" content=\"SweepWidget Help Docs\" \/>\n<meta property=\"article:published_time\" content=\"2020-05-12T15:02:52+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2026-01-18T19:54:44+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/sweepwidget.com\/docs\/wp-content\/uploads\/2020\/05\/background-color-1.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1500\" \/>\n\t<meta property=\"og:image:height\" content=\"844\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"SweepWidget\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Written by\" \/>\n\t<meta name=\"twitter:data1\" content=\"SweepWidget\" \/>\n\t<meta name=\"twitter:label2\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data2\" content=\"4 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/sweepwidget.com\\\/docs\\\/add-a-background-color-to-your-hosted-landing-page#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/sweepwidget.com\\\/docs\\\/add-a-background-color-to-your-hosted-landing-page\"},\"author\":{\"name\":\"SweepWidget\",\"@id\":\"https:\\\/\\\/sweepwidget.com\\\/docs\\\/#\\\/schema\\\/person\\\/4cca2bc9c600116750eca1bfff6648e0\"},\"headline\":\"Add A Background Color To Your Hosted Landing Page\",\"datePublished\":\"2020-05-12T15:02:52+00:00\",\"dateModified\":\"2026-01-18T19:54:44+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/sweepwidget.com\\\/docs\\\/add-a-background-color-to-your-hosted-landing-page\"},\"wordCount\":694,\"commentCount\":0,\"image\":{\"@id\":\"https:\\\/\\\/sweepwidget.com\\\/docs\\\/add-a-background-color-to-your-hosted-landing-page#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/sweepwidget.com\\\/docs\\\/wp-content\\\/uploads\\\/2020\\\/05\\\/background-color-1-1024x576.png\",\"articleSection\":[\"Design\"],\"inLanguage\":\"en-US\"},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/sweepwidget.com\\\/docs\\\/add-a-background-color-to-your-hosted-landing-page\",\"url\":\"https:\\\/\\\/sweepwidget.com\\\/docs\\\/add-a-background-color-to-your-hosted-landing-page\",\"name\":\"Add A Background Color To Your Hosted Landing Page | SweepWidget\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/sweepwidget.com\\\/docs\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/sweepwidget.com\\\/docs\\\/add-a-background-color-to-your-hosted-landing-page#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/sweepwidget.com\\\/docs\\\/add-a-background-color-to-your-hosted-landing-page#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/sweepwidget.com\\\/docs\\\/wp-content\\\/uploads\\\/2020\\\/05\\\/background-color-1-1024x576.png\",\"datePublished\":\"2020-05-12T15:02:52+00:00\",\"dateModified\":\"2026-01-18T19:54:44+00:00\",\"author\":{\"@id\":\"https:\\\/\\\/sweepwidget.com\\\/docs\\\/#\\\/schema\\\/person\\\/4cca2bc9c600116750eca1bfff6648e0\"},\"description\":\"Learn how to add a background color to SweepWidget giveaway on your hosted landing page.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/sweepwidget.com\\\/docs\\\/add-a-background-color-to-your-hosted-landing-page#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/sweepwidget.com\\\/docs\\\/add-a-background-color-to-your-hosted-landing-page\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/sweepwidget.com\\\/docs\\\/add-a-background-color-to-your-hosted-landing-page#primaryimage\",\"url\":\"https:\\\/\\\/sweepwidget.com\\\/docs\\\/wp-content\\\/uploads\\\/2020\\\/05\\\/background-color-1.png\",\"contentUrl\":\"https:\\\/\\\/sweepwidget.com\\\/docs\\\/wp-content\\\/uploads\\\/2020\\\/05\\\/background-color-1.png\",\"width\":1500,\"height\":844},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/sweepwidget.com\\\/docs\\\/add-a-background-color-to-your-hosted-landing-page#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/sweepwidget.com\\\/docs\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Add A Background Color To Your Hosted Landing Page\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/sweepwidget.com\\\/docs\\\/#website\",\"url\":\"https:\\\/\\\/sweepwidget.com\\\/docs\\\/\",\"name\":\"SweepWidget Help Docs\",\"description\":\"\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/sweepwidget.com\\\/docs\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/sweepwidget.com\\\/docs\\\/#\\\/schema\\\/person\\\/4cca2bc9c600116750eca1bfff6648e0\",\"name\":\"SweepWidget\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/08ae098bc2290a9a645af1c26ddd7704f98d09c88bf65a55b5c4bc1e585f31f4?s=96&d=mm&r=g\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/08ae098bc2290a9a645af1c26ddd7704f98d09c88bf65a55b5c4bc1e585f31f4?s=96&d=mm&r=g\",\"contentUrl\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/08ae098bc2290a9a645af1c26ddd7704f98d09c88bf65a55b5c4bc1e585f31f4?s=96&d=mm&r=g\",\"caption\":\"SweepWidget\"},\"sameAs\":[\"https:\\\/\\\/sweepwidget.com\\\/docs\"],\"url\":\"https:\\\/\\\/sweepwidget.com\\\/docs\\\/author\\\/sweepwidget\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Add A Background Color To Your Hosted Landing Page | SweepWidget","description":"Learn how to add a background color to SweepWidget giveaway on your hosted landing page.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/sweepwidget.com\/docs\/add-a-background-color-to-your-hosted-landing-page","og_locale":"en_US","og_type":"article","og_title":"Add A Background Color To Your Hosted Landing Page | SweepWidget","og_description":"Learn how to add a background color to SweepWidget giveaway on your hosted landing page.","og_url":"https:\/\/sweepwidget.com\/docs\/add-a-background-color-to-your-hosted-landing-page","og_site_name":"SweepWidget Help Docs","article_published_time":"2020-05-12T15:02:52+00:00","article_modified_time":"2026-01-18T19:54:44+00:00","og_image":[{"width":1500,"height":844,"url":"https:\/\/sweepwidget.com\/docs\/wp-content\/uploads\/2020\/05\/background-color-1.png","type":"image\/png"}],"author":"SweepWidget","twitter_card":"summary_large_image","twitter_misc":{"Written by":"SweepWidget","Est. reading time":"4 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/sweepwidget.com\/docs\/add-a-background-color-to-your-hosted-landing-page#article","isPartOf":{"@id":"https:\/\/sweepwidget.com\/docs\/add-a-background-color-to-your-hosted-landing-page"},"author":{"name":"SweepWidget","@id":"https:\/\/sweepwidget.com\/docs\/#\/schema\/person\/4cca2bc9c600116750eca1bfff6648e0"},"headline":"Add A Background Color To Your Hosted Landing Page","datePublished":"2020-05-12T15:02:52+00:00","dateModified":"2026-01-18T19:54:44+00:00","mainEntityOfPage":{"@id":"https:\/\/sweepwidget.com\/docs\/add-a-background-color-to-your-hosted-landing-page"},"wordCount":694,"commentCount":0,"image":{"@id":"https:\/\/sweepwidget.com\/docs\/add-a-background-color-to-your-hosted-landing-page#primaryimage"},"thumbnailUrl":"https:\/\/sweepwidget.com\/docs\/wp-content\/uploads\/2020\/05\/background-color-1-1024x576.png","articleSection":["Design"],"inLanguage":"en-US"},{"@type":"WebPage","@id":"https:\/\/sweepwidget.com\/docs\/add-a-background-color-to-your-hosted-landing-page","url":"https:\/\/sweepwidget.com\/docs\/add-a-background-color-to-your-hosted-landing-page","name":"Add A Background Color To Your Hosted Landing Page | SweepWidget","isPartOf":{"@id":"https:\/\/sweepwidget.com\/docs\/#website"},"primaryImageOfPage":{"@id":"https:\/\/sweepwidget.com\/docs\/add-a-background-color-to-your-hosted-landing-page#primaryimage"},"image":{"@id":"https:\/\/sweepwidget.com\/docs\/add-a-background-color-to-your-hosted-landing-page#primaryimage"},"thumbnailUrl":"https:\/\/sweepwidget.com\/docs\/wp-content\/uploads\/2020\/05\/background-color-1-1024x576.png","datePublished":"2020-05-12T15:02:52+00:00","dateModified":"2026-01-18T19:54:44+00:00","author":{"@id":"https:\/\/sweepwidget.com\/docs\/#\/schema\/person\/4cca2bc9c600116750eca1bfff6648e0"},"description":"Learn how to add a background color to SweepWidget giveaway on your hosted landing page.","breadcrumb":{"@id":"https:\/\/sweepwidget.com\/docs\/add-a-background-color-to-your-hosted-landing-page#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/sweepwidget.com\/docs\/add-a-background-color-to-your-hosted-landing-page"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/sweepwidget.com\/docs\/add-a-background-color-to-your-hosted-landing-page#primaryimage","url":"https:\/\/sweepwidget.com\/docs\/wp-content\/uploads\/2020\/05\/background-color-1.png","contentUrl":"https:\/\/sweepwidget.com\/docs\/wp-content\/uploads\/2020\/05\/background-color-1.png","width":1500,"height":844},{"@type":"BreadcrumbList","@id":"https:\/\/sweepwidget.com\/docs\/add-a-background-color-to-your-hosted-landing-page#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/sweepwidget.com\/docs\/"},{"@type":"ListItem","position":2,"name":"Add A Background Color To Your Hosted Landing Page"}]},{"@type":"WebSite","@id":"https:\/\/sweepwidget.com\/docs\/#website","url":"https:\/\/sweepwidget.com\/docs\/","name":"SweepWidget Help Docs","description":"","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/sweepwidget.com\/docs\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":"Person","@id":"https:\/\/sweepwidget.com\/docs\/#\/schema\/person\/4cca2bc9c600116750eca1bfff6648e0","name":"SweepWidget","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/secure.gravatar.com\/avatar\/08ae098bc2290a9a645af1c26ddd7704f98d09c88bf65a55b5c4bc1e585f31f4?s=96&d=mm&r=g","url":"https:\/\/secure.gravatar.com\/avatar\/08ae098bc2290a9a645af1c26ddd7704f98d09c88bf65a55b5c4bc1e585f31f4?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/08ae098bc2290a9a645af1c26ddd7704f98d09c88bf65a55b5c4bc1e585f31f4?s=96&d=mm&r=g","caption":"SweepWidget"},"sameAs":["https:\/\/sweepwidget.com\/docs"],"url":"https:\/\/sweepwidget.com\/docs\/author\/sweepwidget"}]}},"_links":{"self":[{"href":"https:\/\/sweepwidget.com\/docs\/wp-json\/wp\/v2\/posts\/813","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/sweepwidget.com\/docs\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/sweepwidget.com\/docs\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/sweepwidget.com\/docs\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/sweepwidget.com\/docs\/wp-json\/wp\/v2\/comments?post=813"}],"version-history":[{"count":5,"href":"https:\/\/sweepwidget.com\/docs\/wp-json\/wp\/v2\/posts\/813\/revisions"}],"predecessor-version":[{"id":7494,"href":"https:\/\/sweepwidget.com\/docs\/wp-json\/wp\/v2\/posts\/813\/revisions\/7494"}],"wp:attachment":[{"href":"https:\/\/sweepwidget.com\/docs\/wp-json\/wp\/v2\/media?parent=813"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/sweepwidget.com\/docs\/wp-json\/wp\/v2\/categories?post=813"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/sweepwidget.com\/docs\/wp-json\/wp\/v2\/tags?post=813"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}