{"version":"1.0","provider_name":"SweepWidget Help Docs","provider_url":"https:\/\/sweepwidget.com\/docs","author_name":"SweepWidget","author_url":"https:\/\/sweepwidget.com\/docs\/author\/sweepwidget","title":"SweepWidget Design Options: Complete Styling Guide - SweepWidget Help Docs","type":"rich","width":600,"height":338,"html":"<blockquote class=\"wp-embedded-content\" data-secret=\"253jD1lpQZ\"><a href=\"https:\/\/sweepwidget.com\/docs\/sweepwidget-design-options-complete-styling-guide\">SweepWidget Design Options: Complete Styling Guide<\/a><\/blockquote><iframe sandbox=\"allow-scripts\" security=\"restricted\" src=\"https:\/\/sweepwidget.com\/docs\/sweepwidget-design-options-complete-styling-guide\/embed#?secret=253jD1lpQZ\" width=\"600\" height=\"338\" title=\"&#8220;SweepWidget Design Options: Complete Styling Guide&#8221; &#8212; SweepWidget Help Docs\" data-secret=\"253jD1lpQZ\" frameborder=\"0\" marginwidth=\"0\" marginheight=\"0\" scrolling=\"no\" class=\"wp-embedded-content\"><\/iframe><script type=\"text\/javascript\">\n\/* <![CDATA[ *\/\n\/*! This file is auto-generated *\/\n!function(d,l){\"use strict\";l.querySelector&&d.addEventListener&&\"undefined\"!=typeof URL&&(d.wp=d.wp||{},d.wp.receiveEmbedMessage||(d.wp.receiveEmbedMessage=function(e){var t=e.data;if((t||t.secret||t.message||t.value)&&!\/[^a-zA-Z0-9]\/.test(t.secret)){for(var s,r,n,a=l.querySelectorAll('iframe[data-secret=\"'+t.secret+'\"]'),o=l.querySelectorAll('blockquote[data-secret=\"'+t.secret+'\"]'),c=new RegExp(\"^https?:$\",\"i\"),i=0;i<o.length;i++)o[i].style.display=\"none\";for(i=0;i<a.length;i++)s=a[i],e.source===s.contentWindow&&(s.removeAttribute(\"style\"),\"height\"===t.message?(1e3<(r=parseInt(t.value,10))?r=1e3:~~r<200&&(r=200),s.height=r):\"link\"===t.message&&(r=new URL(s.getAttribute(\"src\")),n=new URL(t.value),c.test(n.protocol))&&n.host===r.host&&l.activeElement===s&&(d.top.location.href=t.value))}},d.addEventListener(\"message\",d.wp.receiveEmbedMessage,!1),l.addEventListener(\"DOMContentLoaded\",function(){for(var e,t,s=l.querySelectorAll(\"iframe.wp-embedded-content\"),r=0;r<s.length;r++)(t=(e=s[r]).getAttribute(\"data-secret\"))||(t=Math.random().toString(36).substring(2,12),e.src+=\"#?secret=\"+t,e.setAttribute(\"data-secret\",t)),e.contentWindow.postMessage({message:\"ready\",secret:t},\"*\")},!1)))}(window,document);\n\/\/# sourceURL=https:\/\/sweepwidget.com\/docs\/wp-includes\/js\/wp-embed.min.js\n\/* ]]> *\/\n<\/script>\n","description":"SweepWidget offers extensive design customization options to help you create giveaways that perfectly match your brand. This comprehensive guide covers every setting available in the Design tab, from basic media options to advanced styling controls. Accessing Design Options To access design options: The Design tab has two views: Basic Design Options Featured Photo or Video Add visual media to your giveaway widget to showcase prizes or enhance engagement. Option Description Image Upload a photo or graphic (JPG, PNG, GIF, WebP) YouTube Video Embed a YouTube video by pasting the URL Image Format Options When using an image, choose how it displays in the widget: Format Description Best For Full Width Large image spanning 100% width at top of widget Hero images, banners Small Left Small image floated left, text wraps right Product thumbnails Small Right Small image floated right, text wraps left Product thumbnails Small Above Small centered image between title and description Icons, small products Small Below Small centered image below description Secondary visuals Medium Above Medium centered image between title and description Product photos Medium Below Medium centered image below description Product photos Custom Dimensions Specify exact width and\/or height in pixels Precise sizing needs Custom Dimensions Tip: To maintain proportions, enter only width OR height (leave the other at 0). The image will scale proportionally. Background Image or Color Customize the hosted landing page background: Option Description Image Upload a background image (displays as cover) Color Choose a solid color or gradient using the color picker Note: Background settings only apply to the hosted landing page, not embedded widgets. Custom Logo Add your brand logo to the hosted landing page header. The logo appears above the widget and can link to a URL of your choice. Style Settings (Expanded View) Click + Add Custom Styling To Form to access detailed styling controls. White-Labeling At the top of Style Settings, you&#8217;ll find: Remove SweepWidget branding (top logo + &#8220;Powered by SweepWidget&#8221; footer) Check this box to remove all SweepWidget branding for a fully white-labeled experience. Available on Business plan and above. Container Settings Control the overall widget container appearance: Setting Description Default Border color Color of the widget border #eeeeee (light gray) Border width Thickness of the border in pixels 1px Border radius Corner roundness in pixels (0 = square corners) 10px Max width of widget Maximum width the widget can expand to 600px Body Settings Customize fonts and colors for the main widget content: Setting Description Default Font family Choose from 900+ Google Fonts Roboto Color Main body text color #555555 Font size Body text size in pixels 16px Body background color Background color of the widget body #ffffff (white) Title font color Color of the giveaway title #555555 Title font size Size of the giveaway title in pixels 24px Top Row Settings The top row displays the countdown timer and entry counts. Customize its appearance: Setting Description Default Background color Background of the top stats row #ffffff (white) Entry count color Color of the entry count numbers (e.g., &#8220;55&#8221;) #4a3aff (purple\/blue) Entry count font size Size of entry count numbers 24px Row 2 font color Color of labels like &#8220;Days&#8221;, &#8220;My Entries&#8221; #777777 (gray) Row 2 font size Size of the label text 15px Countdown subtitle text Custom text displayed centered below the countdown and entry count boxes (e.g., &#8220;30 Days till winner is picked!&#8221;) Empty (none) Buttons, Inputs &amp; Links Settings Control the appearance of interactive elements: Buttons Setting Description Default Buttons background color Background color of all buttons #4a3aff (purple\/blue) Buttons font color Text color on buttons #ffffff (white) Buttons font size Button text size in pixels 15px Buttons border radius (edges) Corner roundness of buttons 4px Entry button text value Text displayed on the main entry button &#8220;Enter Giveaway&#8221; Input Fields Setting Description Default Input fields border color Border color of text inputs #c4c4c4 (light gray) Input fields border width Border thickness of inputs in pixels 1px Links &amp; Icons Setting Description Default Link \/ lock icon color Color of links and lock icons #4a3aff (purple\/blue) More Options Additional display and visibility settings: Entry Count Visibility Setting Description Hide &#8220;My Entries&#8221; count Hides the participant&#8217;s personal entry count Hide &#8220;Total Entries&#8221; count Hides the total entries from all participants Entry Methods Display Setting Description Hide entry methods until after the participant logs in Only shows entry methods after user enters their details Entry method icon style Choose Circle or Square icons for entry methods Widget Position Option Description Left Aligns widget to the left of the page Center Centers the widget (default) Right Aligns widget to the right of the page Custom CSS Check Add custom CSS code to open a CSS editor for advanced styling beyond the built-in options. Content Visibility Setting Description Hide title Removes the giveaway title from display Hide description Removes the description text Hide the lines above the title and below the entry methods Removes separator lines for a cleaner look Visual Effects Setting Description Default Border shadow Adds a subtle drop shadow around the widget Enabled Complete Settings Reference Here&#8217;s a quick reference of all design settings with their default values: Category Setting Default Value Container Border color #eeeeee Container Border width 1px Container Border radius 10px Container Max width 600px Body Font family Roboto Body Text color #555555 Body Font size 16px Body Background color #ffffff Body Title color #555555 Body Title size 24px Top Row Background color #ffffff Top Row Entry count color #4a3aff Top Row Entry count size 24px Top Row Label color #777777 Top Row Label size 15px Top Row Countdown subtitle text Empty (none) Buttons Background color #4a3aff Buttons Font color #ffffff Buttons Font size 15px Buttons Border radius 4px Buttons Entry button text Enter Giveaway Inputs Border color #c4c4c4 Inputs Border width 1px Links Link\/icon color #4a3aff Design Tips &amp; Best Practices Common Customization Examples Minimal\/Clean Design Bold\/High Contrast Design Professional\/Corporate Design Plan Requirements Most design options are available on all plans. Some features require specific plans: Feature Required Plan","thumbnail_url":"https:\/\/sweepwidget.com\/docs\/wp-content\/uploads\/2026\/01\/styling-1.png","thumbnail_width":1500,"thumbnail_height":838}