HTML preprocessors can make writing HTML more powerful or convenient. For instance, Markdown is designed to be easier to write and read for text documents and you could write a loop in Pug.
In CodePen, whatever you write in the HTML editor is what goes within the <body>
tags in a basic HTML5 template. So you don't have access to higher-up elements like the <html>
tag. If you want to add classes there that can affect the whole document, this is the place to do it.
In CodePen, whatever you write in the HTML editor is what goes within the <body>
tags in a basic HTML5 template. If you need things in the <head>
of the document, put that code here.
The resource you are linking to is using the 'http' protocol, which may not work when the browser is using https.
CSS preprocessors help make authoring CSS easier. All of them offer things like variables and mixins to provide convenient abstractions.
It's a common practice to apply CSS to a page that styles elements such that they are consistent across all browsers. We offer two of the most popular choices: normalize.css and a reset. Or, choose Neither and nothing will be applied.
To get the best cross-browser support, it is a common practice to apply vendor prefixes to CSS properties and values that require them to work. For instance -webkit-
or -moz-
.
We offer two popular choices: Autoprefixer (which processes your CSS server-side) and -prefix-free (which applies prefixes via a script, client-side).
Any URLs added here will be added as <link>
s in order, and before the CSS in the editor. You can use the CSS from another Pen by using its URL and the proper URL extension.
You can apply CSS to your Pen from any stylesheet on the web. Just put a URL to it here and we'll apply it, in the order you have them, before the CSS in the Pen itself.
You can also link to another Pen here (use the .css
URL Extension) and we'll pull the CSS from that Pen and include it. If it's using a matching preprocessor, use the appropriate URL Extension and we'll combine the code before preprocessing, so you can use the linked Pen as a true dependency.
JavaScript preprocessors can help make authoring JavaScript easier and more convenient.
Babel includes JSX processing.
Any URL's added here will be added as <script>
s in order, and run before the JavaScript in the editor. You can use the URL of any other Pen and it will include the JavaScript from that Pen.
You can apply a script from anywhere on the web to your Pen. Just put a URL to it here and we'll add it, in the order you have them, before the JavaScript in the Pen itself.
If the script you link to has the file extension of a preprocessor, we'll attempt to process it before applying.
You can also link to another Pen here, and we'll pull the JavaScript from that Pen and include it. If it's using a matching preprocessor, we'll combine the code before preprocessing, so you can use the linked Pen as a true dependency.
Search for and use JavaScript packages from npm here. By selecting a package, an import
statement will be added to the top of the JavaScript editor for this package.
Using packages here is powered by esm.sh, which makes packages from npm not only available on a CDN, but prepares them for native JavaScript ESM usage.
All packages are different, so refer to their docs for how they work.
If you're using React / ReactDOM, make sure to turn on Babel for the JSX processing.
If active, Pens will autosave every 30 seconds after being saved once.
If enabled, the preview panel updates automatically as you code. If disabled, use the "Run" button to update.
If enabled, your code will be formatted when you actively save your Pen. Note: your code becomes un-folded during formatting.
Visit your global Editor Settings.
<body class="bg-white text-sky-950 min-h-screen transition duration-300
has-[input#theme:checked]:bg-sky-950
has-[input#theme:checked]:text-white
">
<!-- theme toggle radio -->
<input type="checkbox" id="theme" class="sr-only peer/theme" checked>
<header class="p-6 px-6 flex items-center justify-between
peer-checked/theme:[&_.switch]:bg-slate-600
peer-checked/theme:before:[&_.switch]:inset-[var(--p)_var(--p)_var(--p)_calc(50%+var(--p))]
peer-checked/theme:before:[&_.switch]:bg-sky-950
peer-checked/theme:[&_.switch>span]:text-white">
<div class="flex items-center gap-2">
<img src="https://shismqklzntzxworibfn.supabase.co/storage/v1/object/public/avatars/60c986ed-60f5-43d3-afd8-77f9dd94c36e.png" class="bg-black/50 rounded-full size-10 border border-white/30"> Chris
</div>
<!-- theme toggle switch -->
<div style="--h:2rem;--p:0.25rem;" class="
*:w-[calc(var(--h)*2)]
*:h-[var(--h)]
*:cursor-pointer
*:grid
*:grid-cols-2
*:justify-center
*:rounded-full
*:bg-slate-200
*:transition-all
*:duration-300
*:relative
*:isolate
before:*:absolute
before:*:inset-[var(--p)_calc(50%+var(--p))_var(--p)_var(--p);]
before:*:rounded-full
before:*:bg-yellow-400
before:*:-z-10
before:*:transition-all
before:*:duration-500
before:*:ease-in-out
[&>label>span]:grid
[&>label>span]:place-content-center
[&>label>span]:text-slate-700
[&>label>span]:text-lg
[&>label>span]:transition-all
[&>label>span]:duration-500
">
<label for="theme" class="switch" aria-label="Theme toggle">
<span class="material-symbols-outlined">light_mode</span>
<span class="material-symbols-outlined">dark_mode</span>
</label>
</div>
</header>
<section class="p-6 grid sm:grid-cols-2 gap-8">
<div class="space-y-6">
<h1 class="text-2xl tracking-wider ">365 days<br>+480 challenges</h1>
<h2 class="text-sm w-[32ch]">Completed at least one <a href="https://www.icodethis.com?ref=Chris" target="_blank" class="underline hover:text-rose-300">iCodeThis</a> challenge per day for the last 365 days</h2>
</div>
<div class="[grid-row:2] flex items-center gap-4
*:opacity-70
*:transition
*:duration-300
*:relative
*:isolate
*:p-1
*:size-10
*:grid
*:place-content-center
before:*:absolute
before:*:inset-full
before:*:rounded-full
before:*:bg-black/20
before:*:-z-10
before:*:transition-all
before:*:duration-300
hover:before:*:inset-0
before:*:
hover:*:opacity-100
hover:*:scale-110
">
<a href="https://x.com/cbolson" target="_blank" title="X">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor" class="icon icon-tabler icons-tabler-filled icon-tabler-brand-x">
<path stroke="none" d="M0 0h24v24H0z" fill="none" />
<path d="M8.267 3a1 1 0 0 1 .73 .317l.076 .092l4.274 5.828l5.946 -5.944a1 1 0 0 1 1.497 1.32l-.083 .094l-6.163 6.162l6.262 8.54a1 1 0 0 1 -.697 1.585l-.109 .006h-4.267a1 1 0 0 1 -.73 -.317l-.076 -.092l-4.276 -5.829l-5.944 5.945a1 1 0 0 1 -1.497 -1.32l.083 -.094l6.161 -6.163l-6.26 -8.539a1 1 0 0 1 .697 -1.585l.109 -.006h4.267z" />
</svg>
</a>
<a href="https://github.com/cbolson" target="_blank" title="github">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="currentColor" class="icon icon-tabler icons-tabler-filled icon-tabler-brand-github">
<path stroke="none" d="M0 0h24v24H0z" fill="none" />
<path d="M5.315 2.1c.791 -.113 1.9 .145 3.333 .966l.272 .161l.16 .1l.397 -.083a13.3 13.3 0 0 1 4.59 -.08l.456 .08l.396 .083l.161 -.1c1.385 -.84 2.487 -1.17 3.322 -1.148l.164 .008l.147 .017l.076 .014l.05 .011l.144 .047a1 1 0 0 1 .53 .514a5.2 5.2 0 0 1 .397 2.91l-.047 .267l-.046 .196l.123 .163c.574 .795 .93 1.728 1.03 2.707l.023 .295l.007 .272c0 3.855 -1.659 5.883 -4.644 6.68l-.245 .061l-.132 .029l.014 .161l.008 .157l.004 .365l-.002 .213l-.003 3.834a1 1 0 0 1 -.883 .993l-.117 .007h-6a1 1 0 0 1 -.993 -.883l-.007 -.117v-.734c-1.818 .26 -3.03 -.424 -4.11 -1.878l-.535 -.766c-.28 -.396 -.455 -.579 -.589 -.644l-.048 -.019a1 1 0 0 1 .564 -1.918c.642 .188 1.074 .568 1.57 1.239l.538 .769c.76 1.079 1.36 1.459 2.609 1.191l.001 -.678l-.018 -.168a5.03 5.03 0 0 1 -.021 -.824l.017 -.185l.019 -.12l-.108 -.024c-2.976 -.71 -4.703 -2.573 -4.875 -6.139l-.01 -.31l-.004 -.292a5.6 5.6 0 0 1 .908 -3.051l.152 -.222l.122 -.163l-.045 -.196a5.2 5.2 0 0 1 .145 -2.642l.1 -.282l.106 -.253a1 1 0 0 1 .529 -.514l.144 -.047l.154 -.03z" />
</svg>
</a>
<a href="https://www.linkedin.com/in/chrisbolson/" target="_blank" title="Linkedin">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-brand-linkedin">
<path stroke="none" d="M0 0h24v24H0z" fill="none" />
<path d="M4 4m0 2a2 2 0 0 1 2 -2h12a2 2 0 0 1 2 2v12a2 2 0 0 1 -2 2h-12a2 2 0 0 1 -2 -2z" />
<path d="M8 11l0 5" />
<path d="M8 8l0 .01" />
<path d="M12 16l0 -5" />
<path d="M16 16v-3a2 2 0 0 0 -4 0" />
</svg>
</a>
<a href="https://www.icodethis.com/Chris" target="_blank" title="iCodeThis">
<svg id="icodethis-logo" viewBox="0 0 100 100" fill="none"" style="padding-top:5px" class="size-6">
<path d=" M66.7698 0H42.0371V24.7327H66.7698V0Z" fill="currentColor"></path>
<path d="M42.037 24.7327H0V49.4654H42.037V24.7327Z" fill="currentColor"></path>
<path d="M93.4193 49.4653H41.8115V74.1981H93.4193V49.4653Z" fill="currentColor"></path>
</svg>
</a>
<a href="https://codepen.io/cbolson" target="_blank" title="Codepen">
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32" class="size-6">
<path fill="currentColor"
d="m16 2.844l-.563.375l-12 8.031l-.437.281v8.938l.438.281l12 8.031l.562.375l.563-.375l12-8.031l.437-.281V11.53l-.438-.281l-12-8.031zm-1 3.062v5.438l-5.156 3.469l-4.031-2.72zm2 0l9.188 6.188l-4.032 2.719L17 11.342zm-1 7.188L20.344 16L16 18.906L11.656 16zm-11 .844L8.063 16L5 18.063zm22 0v4.124L23.937 16zm-17.125 3.25L15 20.655v5.438l-9.188-6.188zm12.25 0l4.063 2.718L17 26.094v-5.438z" />
</svg>
</a>
</div>
</section>
<div class="sm:mt-6 flex gap-2 px-6
*:transition-all
*:duration-300
*:opacity-70
disabled:*:opacity-25
hover:[&>button:not([disabled])]:opacity-100
hover:[&>button:not([disabled])]:scale-125
focus-visible:[&>button:not([disabled])]:opacity-100
focus-visible:[&>button:not([disabled])]:scale-125
">
<button type="button" id="btn-prev" title="previous" disabled>
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-chevron-left">
<path stroke="none" d="M0 0h24v24H0z" fill="none" />
<path d="M15 6l-6 6l6 6" />
</svg>
</button>
<button type="button" id="btn-next" title="next">
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon icon-tabler icons-tabler-outline icon-tabler-chevron-right">
<path stroke="none" d="M0 0h24v24H0z" fill="none" />
<path d="M9 6l6 6l-6 6" />
</svg>
</button>
</div>
<section id="gallery" class="my-6 pb-12 grid gap-3 grid-flow-col auto-cols-max overflow-x-auto
[&:has(a:hover)_img:not(:hover)]:scale-[80%]
[&:has(a:hover)_img:not(:hover)]:saturate-50
[scroll-snap-type:x_mandatory;]
max-[400px]:*:w-40
*:w-60
*:[scroll-snap-align:start;]
*:transition-all
*:p-2
[&>a:hover>img]:scale-115
[&_img]:relative
[&_img]:transition-all
[&_img]:duration-300
[&_img]:w-full
[&_img]:h-full
[&_img]:object-cover
[&_img]:z-10
[&_p]:text-xs
[&_p]:p-1
[&_p]:-translate-y-8
[&_p]:opacity-0
[&_p]:transition-all
[&_p]:duration-300
[&_p]:-z-10
[&>a:hover>p]:translate-y-0
[&>a:hover>p]:opacity-100
">
</section>
</body>
const SUBMISSIONS = [
{
"submission_id": "305676",
"mode": "Coming Soon",
"previewImage": "5d867962-2456-43b8-a478-57efd1ed784a.png",
"modeId": "545"
},
{
"submission_id": "305531",
"mode": "Charts",
"previewImage": "b4e1df27-7374-4bb0-9d23-afbb4731a99c.png",
"modeId": "544"
},
{
"submission_id": "305294",
"mode": "Calendar Comps",
"previewImage": "35a01cd5-9788-485d-9592-edc1e6674341.png",
"modeId": "543"
},
{
"submission_id": "305158",
"mode": "Boardme Signup",
"previewImage": "f86fba7a-b991-45a4-a521-41041bd21a14.png",
"modeId": "542"
},
{
"submission_id": "304937",
"mode": "Blog Comps",
"previewImage": "c5e6727b-f787-4901-b75e-400a2c0e7eed.png",
"modeId": "541"
},
{
"submission_id": "304763",
"mode": "Big Menu 2",
"previewImage": "f4766524-53ce-462f-964c-37d97605080d.png",
"modeId": "540"
},
{
"submission_id": "304294",
"mode": "Website Comps",
"previewImage": "bc4f1215-94ed-4c85-99e5-4d26ac44b5f9.png",
"modeId": "558"
},
{
"submission_id": "304177",
"mode": "Search Ui",
"previewImage": "864e914e-ab1c-4712-b27a-054cec8e4c18.png",
"modeId": "555"
},
{
"submission_id": "303823",
"mode": "Search Comps",
"previewImage": "6ab27df6-17f5-453f-b6f0-5e67031e31b9.png",
"modeId": "553"
},
{
"submission_id": "303650",
"mode": "Recipe Comps",
"previewImage": "0df1bec1-088f-47cd-a03f-005427ff8000.png",
"modeId": "552"
},
{
"submission_id": "303266",
"mode": "Rating Comps",
"previewImage": "7ed58df5-a5c4-4c99-a8d4-eb0890c867f2.png",
"modeId": "551"
},
{
"submission_id": "302719",
"mode": "Progress Checks 2",
"previewImage": "34e27e75-8936-403d-af99-0511619c1ee1.png",
"modeId": "550"
},
{
"submission_id": "302624",
"mode": "Filter Comps",
"previewImage": "89f89dc6-f748-4495-89eb-3955cc46864b.png",
"modeId": "549"
},
{
"submission_id": "302546",
"mode": "Skewed Pricing",
"previewImage": "e38e8bbc-b9fe-4784-8642-5c6b87b6c64d.png",
"modeId": "556"
},
{
"submission_id": "302403",
"mode": "Ui Design Daily",
"previewImage": "0f6a71e5-98e4-4567-9798-5e55064a1465.png",
"modeId": "557"
},
{
"submission_id": "302208",
"mode": "Company Card",
"previewImage": "f12977dd-4a27-42e1-8b39-fe8cf95e04df.png",
"modeId": "95"
},
{
"submission_id": "301702",
"mode": "Ecommerce Landing",
"previewImage": "ede17316-2a24-4ac2-9bc1-0fbe9f5122f5.png",
"modeId": "355"
},
{
"submission_id": "301773",
"mode": "Steps",
"previewImage": "9b2751ce-b755-4963-955e-6a748a04fc57.png",
"modeId": "93"
},
{
"submission_id": "301719",
"mode": "New Message",
"previewImage": "98fa42d2-7a0f-4cc1-98db-78d066640756.png",
"modeId": "422"
},
{
"submission_id": "301521",
"mode": "Translator App",
"previewImage": "bf9e78eb-6351-456f-9ff0-198cd2b5a8b5.png",
"modeId": "411"
},
{
"submission_id": "301351",
"mode": "Social Profile",
"previewImage": "13ad373d-615a-4cfc-b9a5-221b9a6023d5.png",
"modeId": "76"
},
{
"submission_id": "301204",
"mode": "Task Details",
"previewImage": "186f11bf-ae0b-47f6-b104-3dccc47cb67c.png",
"modeId": "340"
},
{
"submission_id": "300988",
"mode": "Domain Landing Page",
"previewImage": "52c5c2fe-3766-4c3f-aa40-2b43bbe35816.png",
"modeId": "431"
},
{
"submission_id": "300795",
"mode": "Social Profile 2",
"previewImage": "3f983193-a53d-4f01-ad4e-da1c6baeacf0.png",
"modeId": "522"
},
{
"submission_id": "300583",
"mode": "Fancy Sliders",
"previewImage": "3b978c8c-2572-496e-8a00-97ec7689a5ed.png",
"modeId": "78"
},
{
"submission_id": "300277",
"mode": "Sync Component",
"previewImage": "1cf56e34-1be9-4563-9225-58adb92f854c.png",
"modeId": "526"
},
{
"submission_id": "300009",
"mode": "Testimonial Slider",
"previewImage": "ca781ea1-9796-4aae-a6cd-47f100b830fc.png",
"modeId": "527"
},
{
"submission_id": "299920",
"mode": "Webshop Components 2",
"previewImage": "36436625-9186-4d57-b058-bcea5692a156.png",
"modeId": "532"
},
{
"submission_id": "299697",
"mode": "User Type Select",
"previewImage": "c65f12d2-ef33-4b00-8451-260d87074aa8.png",
"modeId": "531"
},
{
"submission_id": "299330",
"mode": "User Profile Form",
"previewImage": "2d611c68-eb84-4e55-8701-90e0405a3a5b.png",
"modeId": "530"
},
{
"submission_id": "299188",
"mode": "Upload Media",
"previewImage": "36f94398-1044-4b61-abaa-b3606ca358e2.png",
"modeId": "529"
},
{
"submission_id": "298898",
"mode": "Tooltip",
"previewImage": "78bcfcf1-3d48-4a12-8039-97708d2113fe.png",
"modeId": "528"
},
{
"submission_id": "298558",
"mode": "Statistics 2",
"previewImage": "f8479485-6685-43a7-8d96-ba60c4d5abd9.png",
"modeId": "444"
},
{
"submission_id": "298133",
"mode": "Survey",
"previewImage": "540ad152-b4f1-4cfb-b609-f06e95e5ba93.png",
"modeId": "525"
},
{
"submission_id": "297825",
"mode": "Subscribe Popup",
"previewImage": "702a089e-624e-4c35-bf70-43bf3c724e14.png",
"modeId": "524"
},
{
"submission_id": "297527",
"mode": "Sound Settings",
"previewImage": "dcecab2e-0b48-461b-80ab-4d2814fb9134.png",
"modeId": "523"
},
{
"submission_id": "296939",
"mode": "Simple Cards 2",
"previewImage": "10109702-fadd-40de-8fca-8ec1f77e7f3a.png",
"modeId": "521"
},
{
"submission_id": "296680",
"mode": "Sign-in Select",
"previewImage": "0395a728-df7c-4c5d-9cc2-ee43fe4bec70.png",
"modeId": "520"
},
{
"submission_id": "296526",
"mode": "Sidebar Menu",
"previewImage": "d6b7cd81-642c-4edd-8eef-a004d6a24010.png",
"modeId": "519"
},
{
"submission_id": "295601",
"mode": "JoBurger #5",
"previewImage": "71ef18d0-c918-409b-b2ef-3424c2d7aa7c.png",
"modeId": "537"
},
{
"submission_id": "295418",
"mode": "JoBurger #4",
"previewImage": "6e07c0a5-deb7-4b24-a2e1-fbab2006b55c.png",
"modeId": "536"
},
{
"submission_id": "295208",
"mode": "JoBurger #3",
"previewImage": "df2ce413-2cce-4047-a32d-fd8938365fd2.png",
"modeId": "535"
},
{
"submission_id": "294981",
"mode": "JoBurger #2",
"previewImage": "148ee527-0cd1-479f-9d92-47df01e73c25.png",
"modeId": "534"
},
{
"submission_id": "294843",
"mode": "JoBurger #1",
"previewImage": "8a55a885-c988-4db5-8395-4c32f31b3693.png",
"modeId": "533"
},
{
"submission_id": "294435",
"mode": "Landing Page",
"previewImage": "dc9bca62-cae9-47d4-8ab2-430b623b2b29.png",
"modeId": "423"
},
{
"submission_id": "294364",
"mode": "Rent A Car",
"previewImage": "069ce837-dfb6-46fe-9dd0-9e34492328d1.png",
"modeId": "475"
},
{
"submission_id": "294239",
"mode": "Pending Invites",
"previewImage": "35dde480-4ae1-4490-9809-92599540e025.png",
"modeId": "446"
},
{
"submission_id": "294060",
"mode": "Billing",
"previewImage": "1ee6fa56-2440-4e08-8ce3-628af8e635fd.png",
"modeId": "147"
},
{
"submission_id": "293894",
"mode": "Stats Cards",
"previewImage": "4dde8f40-e75e-4cfb-a162-582b52fa23fc.png",
"modeId": "420"
},
{
"submission_id": "293758",
"mode": "Kanban",
"previewImage": "5aecfc20-3bda-4d78-8138-050541011276.png",
"modeId": "120"
},
{
"submission_id": "293564",
"mode": "Projects Chart",
"previewImage": "0f384d32-0829-4b92-a600-7013a434f29a.png",
"modeId": "94"
},
{
"submission_id": "293459",
"mode": "Drink Water",
"previewImage": "2ec8f1ef-2076-4b29-bc7f-baba2e144628.png",
"modeId": "74"
},
{
"submission_id": "293358",
"mode": "Webinar Signup",
"previewImage": "a48e1d08-dde3-4d10-adf0-9e8949716635.png",
"modeId": "144"
},
{
"submission_id": "293196",
"mode": "Courses Landing",
"previewImage": "e41fc5d3-d025-4451-abc4-4ad599ae5158.png",
"modeId": "464"
},
{
"submission_id": "293041",
"mode": "Portfolio Profile",
"previewImage": "cefe75c8-3e21-4048-9e0d-84f26b229821.png",
"modeId": "48"
},
{
"submission_id": "292865",
"mode": "Mortgage Calculator",
"previewImage": "745871c1-faf5-47f1-a925-c10ac9f00a3e.png",
"modeId": "102"
},
{
"submission_id": "292596",
"mode": "Circle Team",
"previewImage": "120d8510-a934-402a-8ceb-f6a5594c2655.png",
"modeId": "518"
},
{
"submission_id": "292273",
"mode": "Pagination",
"previewImage": "eca76419-4fdd-4782-b6f1-3879854f108e.png",
"modeId": "87"
},
{
"submission_id": "292073",
"mode": "Video Player",
"previewImage": "bcc3a4a6-d7ec-428e-9786-ec6a3a4e2a4d.png",
"modeId": "117"
},
{
"submission_id": "234911",
"mode": "Video Player 2",
"previewImage": "00d6ec4c-20d4-4d15-adc5-f41d0b59749a.png",
"modeId": "441"
},
{
"submission_id": "291038",
"mode": "Design System",
"previewImage": "e3862002-064c-4840-8b5f-76adce2eac0a.png",
"modeId": "451"
},
{
"submission_id": "290561",
"mode": "Notes App",
"previewImage": "88089669-f31e-4efc-88f2-1e8304a1d5bf.png",
"modeId": "129"
},
{
"submission_id": "290342",
"mode": "Blog Header",
"previewImage": "0684869b-97d2-446d-9e0b-cc801d2ef034.png",
"modeId": "106"
},
{
"submission_id": "289738",
"mode": "Verify Code",
"previewImage": "9272b306-3be6-4d24-a546-93713a48c9ea.png",
"modeId": "134"
},
{
"submission_id": "289604",
"mode": "Apps List",
"previewImage": "1b5463bf-dcdf-4689-bd0f-231115c93345.png",
"modeId": "104"
},
{
"submission_id": "289183",
"mode": "Redeem Coupon",
"previewImage": "0ec00c47-d99e-4d18-802d-7a32aef0df2c.png",
"modeId": "517"
},
{
"submission_id": "289020",
"mode": "Rainbow Section",
"previewImage": "018a3901-fdb2-4cf4-8586-a7ad3fc84576.png",
"modeId": "516"
},
{
"submission_id": "288911",
"mode": "Progress Bars",
"previewImage": "a5531e39-bcc3-4e9f-8961-2b9f89614848.png",
"modeId": "515"
},
{
"submission_id": "288758",
"mode": "Profile Cards Ui",
"previewImage": "4731a358-c230-4378-a7bb-9003a8211af9.png",
"modeId": "514"
},
{
"submission_id": "288661",
"mode": "Profile Card 2",
"previewImage": "8f8742fa-c523-4d6d-bdb8-346501237ef6.png",
"modeId": "513"
},
{
"submission_id": "288537",
"mode": "Pricing Plans",
"previewImage": "c51ff1b3-5a0f-4490-8287-ab7852ef9c4b.png",
"modeId": "512"
},
{
"submission_id": "288427",
"mode": "Post Section",
"previewImage": "aeb802f3-eddf-4cda-9c9b-9782cf2d90d0.png",
"modeId": "511"
},
{
"submission_id": "288333",
"mode": "Poll 2",
"previewImage": "1164a59d-30cf-4c54-902f-608d0e887a14.png",
"modeId": "510"
},
{
"submission_id": "288175",
"mode": "Plant Care App",
"previewImage": "33880691-b7fd-4a18-a7a9-24a8fd900f90.png",
"modeId": "509"
},
{
"submission_id": "288028",
"mode": "Photos Slider",
"previewImage": "24b5caca-51b9-4b92-8487-89c202193e3a.png",
"modeId": "508"
},
{
"submission_id": "287952",
"mode": "Neumorphic Ui 2",
"previewImage": "0e304ab9-b627-4360-b814-78348a491232.png",
"modeId": "506"
},
{
"submission_id": "287818",
"mode": "Navigation Kit",
"previewImage": "cff6076a-62bb-402a-8c45-bbb385271b57.png",
"modeId": "507"
},
{
"submission_id": "287739",
"mode": "Nav Dropdown",
"previewImage": "1d88c3ab-f26a-4627-ba03-707d27d13d8a.png",
"modeId": "153"
},
{
"submission_id": "287588",
"mode": "Mobile Blogging App",
"previewImage": "5b72d716-6b20-4300-ba0a-230dd25ee2f4.png",
"modeId": "151"
},
{
"submission_id": "287384",
"mode": "Missed Call Card",
"previewImage": "50ef4877-f217-4df1-8fea-e1d0519e8388.png",
"modeId": "152"
},
{
"submission_id": "287304",
"mode": "Mind Map",
"previewImage": "91462b31-ff9a-4fd5-8de6-3bba3d477dba.png",
"modeId": "154"
},
{
"submission_id": "287124",
"mode": "Meeting End Screen",
"previewImage": "70e390ed-e641-424b-9d26-f09b2899fc6a.png",
"modeId": "155"
},
{
"submission_id": "286999",
"mode": "Login Screen 2",
"previewImage": "e7e45deb-f6be-4620-8ba7-d23dbb5b84b9.png",
"modeId": "156"
},
{
"submission_id": "286887",
"mode": "Login Dark Theme",
"previewImage": "551ec6c2-b111-4048-a9de-b19a7c66caad.png",
"modeId": "157"
},
{
"submission_id": "286723",
"mode": "Job Post",
"previewImage": "8840633e-2800-4add-a5d8-f6301ed97499.png",
"modeId": "158"
},
{
"submission_id": "286611",
"mode": "Hiring Profile",
"previewImage": "a9875b4a-d7d4-4a7a-9b72-1cee7827f818.png",
"modeId": "159"
},
{
"submission_id": "286462",
"mode": "Give Feedback",
"previewImage": "7b44e872-a810-4d57-bd52-3ba840d94e21.png",
"modeId": "160"
},
{
"submission_id": "286377",
"mode": "Get The App Popup",
"previewImage": "2c12ac52-4a59-42a8-a805-da34d926db5e.png",
"modeId": "161"
},
{
"submission_id": "286221",
"mode": "Form Dark Theme",
"previewImage": "ba6d6387-7b82-4a24-b209-c97c288e5afe.png",
"modeId": "162"
},
{
"submission_id": "286085",
"mode": "Follower Stats",
"previewImage": "11cd929f-8caf-4c33-b2b8-ad0ec77b4560.png",
"modeId": "163"
},
{
"submission_id": "286038",
"mode": "Filter Components",
"previewImage": "edbbfcbd-e921-470a-8d67-481caf9c32c1.png",
"modeId": "164"
},
{
"submission_id": "285886",
"mode": "Enable Notifications",
"previewImage": "d457c265-3f89-4172-8b51-ad0b20f9d2e1.png",
"modeId": "165"
},
{
"submission_id": "285747",
"mode": "Empty Board",
"previewImage": "24df3d8b-1d6f-4a18-a809-473ac9045559.png",
"modeId": "166"
},
{
"submission_id": "285610",
"mode": "E-Ticket 2",
"previewImage": "56a1f1db-a82d-4acb-bff1-56bdb469ae90.png",
"modeId": "167"
},
{
"submission_id": "285526",
"mode": "Course Progress",
"previewImage": "617c7026-f3c5-4c0e-8c91-70ed6b31e95d.png",
"modeId": "168"
},
{
"submission_id": "285329",
"mode": "Countdown 3",
"previewImage": "a9187e50-ac94-4470-b967-3a6842abcf17.png",
"modeId": "169"
},
{
"submission_id": "285245",
"mode": "Clock In App",
"previewImage": "e34da963-1c8e-4f13-bd7b-198ae3183697.png",
"modeId": "170"
},
{
"submission_id": "285043",
"mode": "Breadcrumbs 2",
"previewImage": "44135b53-95bb-48db-aa1c-239af3cdef6f.png",
"modeId": "171"
},
{
"submission_id": "284912",
"mode": "Billing Cards",
"previewImage": "9ac88602-8cb0-4af9-8505-850f9397dbbc.png",
"modeId": "172"
},
{
"submission_id": "284771",
"mode": "Alarm",
"previewImage": "c9818df9-f8e8-431f-b8b1-d807ad1eda64.png",
"modeId": "173"
},
{
"submission_id": "284626",
"mode": "Account Settings",
"previewImage": "60798762-cd02-40d3-8c85-2617b4dd4811.png",
"modeId": "174"
},
{
"submission_id": "284508",
"mode": "Account Panel",
"previewImage": "73de1db1-509c-4542-ae6a-972954797c15.png",
"modeId": "175"
},
{
"submission_id": "284402",
"mode": "Account Dropdown",
"previewImage": "6be4834d-7206-4cd2-bf07-347952e81a62.png",
"modeId": "176"
},
{
"submission_id": "284178",
"mode": "Webshop Components",
"previewImage": "48813223-fae2-411a-9ed6-51779fbdff37.png",
"modeId": "177"
},
{
"submission_id": "284058",
"mode": "Users List",
"previewImage": "7ad377ea-a8e7-4070-b7ad-31e115f112f1.png",
"modeId": "178"
},
{
"submission_id": "283847",
"mode": "User Profile Ui Kit",
"previewImage": "610af786-5e12-434c-99ad-3c97b346ecd4.png",
"modeId": "179"
},
{
"submission_id": "283611",
"mode": "User Authentication",
"previewImage": "a09e9b34-48bb-4e4e-8675-09b3e5cb7be9.png",
"modeId": "180"
},
{
"submission_id": "283490",
"mode": "To Do 2",
"previewImage": "0bb774cf-4cd9-414b-8b06-17d99fdba5dc.png",
"modeId": "181"
},
{
"submission_id": "283338",
"mode": "Subscription Plan",
"previewImage": "020be4eb-b0d8-449c-88e0-fd0bd7437681.png",
"modeId": "182"
},
{
"submission_id": "283159",
"mode": "Statistics Website",
"previewImage": "029ed7d1-d497-4e0b-abf7-fe25689011b8.png",
"modeId": "183"
},
{
"submission_id": "283118",
"mode": "Sport Webshop",
"previewImage": "8cd3beba-69fc-40aa-b2f9-b27c1eabfba5.png",
"modeId": "184"
},
{
"submission_id": "282860",
"mode": "Settings Widget",
"previewImage": "e0a6fcfa-111c-4602-8fad-c2fc38519118.png",
"modeId": "185"
},
{
"submission_id": "224484",
"mode": "Pricing Card",
"previewImage": "37765b6d-6f3f-4f6f-a353-2f78dbe6b307.png",
"modeId": "90"
},
{
"submission_id": "236359",
"mode": "Info Section",
"previewImage": "1f7b123a-bdcf-40f4-9c2d-fe05627154e4.png",
"modeId": "424"
},
{
"submission_id": "282794",
"mode": "Promote Link",
"previewImage": "d6350410-dfd9-49ae-baa0-5db74c876f0d.png",
"modeId": "186"
},
{
"submission_id": "282634",
"mode": "Payment Method 2",
"previewImage": "54404411-bac1-4ae4-ad7c-7108eedd4bff.png",
"modeId": "187"
},
{
"submission_id": "282474",
"mode": "Payment App",
"previewImage": "5f54f8a9-6b3c-40de-9c56-cb7a8943f2fe.png",
"modeId": "188"
},
{
"submission_id": "282296",
"mode": "Job Board",
"previewImage": "4fb8b9d1-69f7-4cee-9e7b-a30c60d223a2.png",
"modeId": "189"
},
{
"submission_id": "282128",
"mode": "Details Card",
"previewImage": "3b8bdf9f-ad97-461b-9140-02bd1900fa5e.png",
"modeId": "190"
},
{
"submission_id": "282016",
"mode": "Ui Components",
"previewImage": "dfd7f938-7c34-46a7-914f-b0bd317d4b4e.png",
"modeId": "191"
},
{
"submission_id": "281818",
"mode": "Resources Slider",
"previewImage": "729f8171-e956-4382-8c16-f65f5570dfd0.png",
"modeId": "192"
},
{
"submission_id": "223900",
"mode": "Statistics",
"previewImage": "eb612aa4-c5f3-4676-bc19-bd5240cfabd8.png",
"modeId": "81"
},
{
"submission_id": "235143",
"mode": "Dashboard Ui",
"previewImage": "1afd4729-f316-4ecb-93e1-22140438a7b7.png",
"modeId": "439"
},
{
"submission_id": "281672",
"mode": "Message Notification",
"previewImage": "f612bf42-b5fc-490d-9918-8bc1faafe157.png",
"modeId": "193"
},
{
"submission_id": "227171",
"mode": "Incident History",
"previewImage": "27a3ad1d-4b12-4b49-922a-47b11b411020.png",
"modeId": "122"
},
{
"submission_id": "281472",
"mode": "Login Screen",
"previewImage": "c257e1df-c3e9-4f3c-b32d-5e9f2544f76e.png",
"modeId": "194"
},
{
"submission_id": "281329",
"mode": "Inbox Ui",
"previewImage": "83709180-9b54-47bd-a36f-b041103ec6c4.png",
"modeId": "195"
},
{
"submission_id": "281194",
"mode": "Add Collection",
"previewImage": "81bffb04-8022-4e09-b119-b21a7247842f.png",
"modeId": "196"
},
{
"submission_id": "228271",
"mode": "Donate",
"previewImage": "a6c2399d-30b0-4caa-ab60-d70621ebba47.png",
"modeId": "138"
},
{
"submission_id": "281039",
"mode": "Account Ui",
"previewImage": "fa4be809-a65f-443c-b159-7c506161f3bb.png",
"modeId": "197"
},
{
"submission_id": "280955",
"mode": "Restaurant UI Kit",
"previewImage": "7ef4b95c-edab-4d9e-bce8-f824037671dd.png",
"modeId": "198"
},
{
"submission_id": "280747",
"mode": "Vertical Landing",
"previewImage": "10fdaa6f-f09a-492c-b827-e263056810e3.png",
"modeId": "199"
},
{
"submission_id": "280633",
"mode": "Travel Itinerary",
"previewImage": "2a5b1e2a-f6e0-4de3-9129-780b46d153b5.png",
"modeId": "200"
},
{
"submission_id": "280413",
"mode": "Subscription Pricing",
"previewImage": "a232bade-9f18-45d5-95ed-7cd042c8cda9.png",
"modeId": "201"
},
{
"submission_id": "280234",
"mode": "Social Profile Light",
"previewImage": "003c5527-4d13-4302-b518-0ad5f0201e49.png",
"modeId": "202"
},
{
"submission_id": "280137",
"mode": "Simple Pricing 2",
"previewImage": "a6c09635-f7f3-4162-97a8-e75805f7a6cd.png",
"modeId": "203"
},
{
"submission_id": "279859",
"mode": "Resturants Location",
"previewImage": "6c75e39d-c177-4cd5-a5ea-d978c9be2432.png",
"modeId": "204"
},
{
"submission_id": "279556",
"mode": "Basics",
"previewImage": "ea17cb1c-5fdf-4a12-b6b1-bb88f843ceee.png",
"modeId": "67"
},
{
"submission_id": "226281",
"mode": "UI Cards",
"previewImage": "06a8a651-da1c-48da-a69d-6e5341315902.png",
"modeId": "113"
},
{
"submission_id": "279387",
"mode": "Recording UI",
"previewImage": "eaa4f4c0-e1f3-4767-a285-a587bef2f145.png",
"modeId": "205"
},
{
"submission_id": "224323",
"mode": "Movie Ticket",
"previewImage": "2c70a521-8b36-4fff-8b71-bcf8b48be13d.png",
"modeId": "64"
},
{
"submission_id": "279266",
"mode": "Projects Board",
"previewImage": "44a3bfd1-bd21-41ba-b2cf-ba42b57550df.png",
"modeId": "206"
},
{
"submission_id": "279027",
"mode": "One Time Pricing",
"previewImage": "014146e2-7a32-42b2-892c-e850be2b7411.png",
"modeId": "207"
},
{
"submission_id": "278943",
"mode": "Nav Header UI",
"previewImage": "3aa507f6-52e0-4e43-a856-97b307e9f9ec.png",
"modeId": "208"
},
{
"submission_id": "278819",
"mode": "Music Profile",
"previewImage": "f93de88d-fa4b-4ffb-b023-983026821a4c.png",
"modeId": "209"
},
{
"submission_id": "278596",
"mode": "Language Learn",
"previewImage": "5cd617de-6273-4b8e-9dd2-0b5370a90fdd.png",
"modeId": "210"
},
{
"submission_id": "278505",
"mode": "Full Page Select",
"previewImage": "329085e8-5b8d-4e00-9772-258a7344dc1e.png",
"modeId": "211"
},
{
"submission_id": "278273",
"mode": "Double Registration",
"previewImage": "130f49ea-54cf-4453-b3f7-e60daf530a9f.png",
"modeId": "212"
},
{
"submission_id": "224599",
"mode": "Team Page",
"previewImage": "15ee7c9f-7e92-4b17-bf24-21842808234b.png",
"modeId": "92"
},
{
"submission_id": "225851",
"mode": "Followers",
"previewImage": "47622d16-f310-488c-9210-8d3d4963aa53.png",
"modeId": "108"
},
{
"submission_id": "226064",
"mode": "Newsletter",
"previewImage": "042aa793-98d4-47a1-9dac-c88798fab104.png",
"modeId": "110"
},
{
"submission_id": "278122",
"mode": "Documents App",
"previewImage": "8439095e-b4ad-4b37-a618-704ffa4aed1a.png",
"modeId": "213"
},
{
"submission_id": "225320",
"mode": "Calculator",
"previewImage": "a298f71f-f990-40b5-b6e6-f06979ea32af.png",
"modeId": "47"
},
{
"submission_id": "277880",
"mode": "Curriculum Progress",
"previewImage": "9f6d61cd-fcb6-4748-924d-ee3e610e59ad.png",
"modeId": "214"
},
{
"submission_id": "277758",
"mode": "Course CTA",
"previewImage": "22f87ea5-feac-4629-835b-58d8996fbf92.png",
"modeId": "215"
},
{
"submission_id": "277631",
"mode": "Cookie Notification",
"previewImage": "d243d3a3-72cd-495d-9c73-48e964e91212.png",
"modeId": "216"
},
{
"submission_id": "277393",
"mode": "Calculator 2",
"previewImage": "51cfc6a0-e403-43a1-8a3a-4fe40ebf9a9b.png",
"modeId": "217"
},
{
"submission_id": "277245",
"mode": "Analytics Graph",
"previewImage": "59d2c99a-7eab-4672-a4fd-c1096cdd3fec.png",
"modeId": "218"
},
{
"submission_id": "277069",
"mode": "20s Profile",
"previewImage": "e70305ab-1e6a-4037-bd84-4de1a16dcee3.png",
"modeId": "219"
},
{
"submission_id": "227013",
"mode": "Pricing Table 2",
"previewImage": "c4ec2b53-e893-4d01-aafa-54ca37f05ac9.png",
"modeId": "121"
},
{
"submission_id": "228195",
"mode": "Chatbox",
"previewImage": "fe3363c1-1e39-4cfc-8f3f-934b5932f950.png",
"modeId": "137"
},
{
"submission_id": "276855",
"mode": "Testimonials 4",
"previewImage": "021bac8d-9d02-4f1a-9775-e13e48ac8598.png",
"modeId": "220"
},
{
"submission_id": "276644",
"mode": "Storage Plans",
"previewImage": "dac4718e-6457-42a7-81ba-3568f671327b.png",
"modeId": "221"
},
{
"submission_id": "276513",
"mode": "Social Invite",
"previewImage": "2d1b520c-6c4a-46b0-9c79-80dbb276e9a3.png",
"modeId": "222"
},
{
"submission_id": "276427",
"mode": "Select Account",
"previewImage": "c865de47-d49a-4c24-bb4e-1773d31baa78.png",
"modeId": "223"
},
{
"submission_id": "276174",
"mode": "Product Comps",
"previewImage": "d3abceb2-069f-4e78-970c-643cbec4691e.png",
"modeId": "224"
},
{
"submission_id": "275981",
"mode": "Grid Footer",
"previewImage": "814b07c4-459a-4ae2-8557-dbae3c00d303.png",
"modeId": "225"
},
{
"submission_id": "275796",
"mode": "Blog Ui",
"previewImage": "6b8150ad-1d8f-40cf-a190-f2d855424921.png",
"modeId": "226"
},
{
"submission_id": "275689",
"mode": "Blog Page",
"previewImage": "080db1a2-898f-493b-9663-54d342ceaf86.png",
"modeId": "227"
},
{
"submission_id": "275450",
"mode": "Available Positions",
"previewImage": "33b85401-9c0b-42c0-a7f1-5e3d1975198c.png",
"modeId": "228"
},
{
"submission_id": "223485",
"mode": "Christmas Promo",
"previewImage": "bd5f1a69-fa27-4a5e-87c3-fe27604b6820.png",
"modeId": "60"
},
{
"submission_id": "275254",
"mode": "iCodeMas #24",
"previewImage": "d83b42dc-edbd-4c8f-b7b0-32777c640f66.png",
"modeId": "229"
},
{
"submission_id": "275100",
"mode": "iCodeMas #23",
"previewImage": "84882a2e-166b-4f8b-8fcf-96b84d23c842.png",
"modeId": "230"
},
{
"submission_id": "274907",
"mode": "iCodeMas #22",
"previewImage": "c5989c4e-a05c-4128-a781-bab151ee8198.png",
"modeId": "231"
},
{
"submission_id": "274714",
"mode": "iCodeMas #21",
"previewImage": "19ed0788-41e1-40df-a664-a44377aa6498.png",
"modeId": "232"
},
{
"submission_id": "274579",
"mode": "iCodeMas #20",
"previewImage": "8fad3daf-38f3-44bb-b6e4-e536e8121c19.png",
"modeId": "233"
},
{
"submission_id": "274393",
"mode": "iCodeMas #19",
"previewImage": "decda9d1-51d6-4bf8-b81d-8e96f0e5f756.png",
"modeId": "234"
},
{
"submission_id": "274151",
"mode": "iCodeMas #18",
"previewImage": "56ee1b0b-e687-45b3-96fc-479d6d28fffd.png",
"modeId": "235"
},
{
"submission_id": "273989",
"mode": "iCodeMas #17",
"previewImage": "2924915b-e9b1-4c3d-ac11-1b195e92123d.png",
"modeId": "236"
},
{
"submission_id": "273843",
"mode": "iCodeMas #16",
"previewImage": "e99077b9-4a55-4f1e-8716-b32a00cdf724.png",
"modeId": "237"
},
{
"submission_id": "273570",
"mode": "iCodeMas #15",
"previewImage": "2c26251c-f33b-440d-b1bb-163cdfdafca5.png",
"modeId": "238"
},
{
"submission_id": "273323",
"mode": "iCodeMas #14",
"previewImage": "6cc071a9-0ac6-4a1e-9ddf-c333d5375368.png",
"modeId": "239"
},
{
"submission_id": "273167",
"mode": "iCodeMas #13",
"previewImage": "16f527d1-ec61-400e-8a42-4a72841f45ac.png",
"modeId": "240"
},
{
"submission_id": "272983",
"mode": "iCodeMas #12",
"previewImage": "4129c5f2-4d6d-4125-8dd2-676ce5d40849.png",
"modeId": "241"
},
{
"submission_id": "224062",
"mode": "Blog Cards 2",
"previewImage": "95ebd8e2-1fdf-4483-bce9-6ef95fc9b32e.png",
"modeId": "83"
},
{
"submission_id": "229933",
"mode": "Shopping Cart",
"previewImage": "f971430d-1e99-48c4-a726-07be35663771.png",
"modeId": "498"
},
{
"submission_id": "223134",
"mode": "User Feedback",
"previewImage": "80d577b9-97e1-43b0-b95e-4da6f4730b00.png",
"modeId": "72"
},
{
"submission_id": "272767",
"mode": "iCodeMas #11",
"previewImage": "bb6555ea-3f39-4ab0-8912-974fecf1fbcb.png",
"modeId": "242"
},
{
"submission_id": "272558",
"mode": "iCodeMas #10",
"previewImage": "15d0e8e5-5334-4700-b561-162dd22e4a20.png",
"modeId": "243"
},
{
"submission_id": "272337",
"mode": "iCodeMas #09",
"previewImage": "316fa43f-7859-4f70-b65b-bfb97babd758.png",
"modeId": "244"
},
{
"submission_id": "272194",
"mode": "iCodeMas #08",
"previewImage": "9a5b9f85-594f-4887-8583-75b89728bbac.png",
"modeId": "245"
},
{
"submission_id": "271975",
"mode": "iCodeMas #07",
"previewImage": "40c06e7a-5065-4552-8f5e-56cf6b3b7bec.png",
"modeId": "246"
},
{
"submission_id": "271747",
"mode": "iCodeMas #06",
"previewImage": "d7e99f11-313f-4c1d-ac3b-a961be804773.png",
"modeId": "247"
},
{
"submission_id": "271507",
"mode": "iCodeMas #05",
"previewImage": "bbeee2f7-e253-43a1-a759-3018c2522776.png",
"modeId": "248"
},
{
"submission_id": "271116",
"mode": "iCodeMas #04",
"previewImage": "94c3ac2c-3778-42bd-a5af-74d98c96e55c.png",
"modeId": "249"
},
{
"submission_id": "228147",
"mode": "Carousel",
"previewImage": "68e44616-a67e-4474-a50f-00e1e5071f04.png",
"modeId": "136"
},
{
"submission_id": "270832",
"mode": "iCodeMas #03",
"previewImage": "83b07fa8-62c1-4fdb-99ca-af9ba52d1b73.png",
"modeId": "250"
},
{
"submission_id": "270498",
"mode": "iCodeMas #02",
"previewImage": "9a9a7f0f-5a2f-42e9-8f42-00707f0bd81a.png",
"modeId": "251"
},
{
"submission_id": "270252",
"mode": "iCodeMas #01",
"previewImage": "cdc336b3-b91c-4bee-aef2-57402dd9821c.png",
"modeId": "252"
},
{
"submission_id": "227632",
"mode": "Music Store",
"previewImage": "8569817e-0dad-4470-98ed-a0d6add1fa4b.png",
"modeId": "128"
},
{
"submission_id": "225780",
"mode": "FAQ",
"previewImage": "79e3cbcb-c168-476f-978f-611629eef052.png",
"modeId": "107"
},
{
"submission_id": "269751",
"mode": "Simple Contact",
"previewImage": "c3b495d0-d83e-4b11-918d-003d16973e7f.png",
"modeId": "253"
},
{
"submission_id": "226729",
"mode": "Color Generator",
"previewImage": "58613d66-2148-45db-8a8a-e95d68e6c2b8.png",
"modeId": "118"
},
{
"submission_id": "224108",
"mode": "Blog Post",
"previewImage": "879922b0-87e1-4b23-8862-f1543cc69b20.png",
"modeId": "84"
},
{
"submission_id": "226456",
"mode": "User Card",
"previewImage": "d068c9d8-3fc0-4778-be8f-494d8f98aee6.png",
"modeId": "115"
},
{
"submission_id": "269508",
"mode": "Pricing Saas",
"previewImage": "a42896cf-cc0b-48a2-b235-0c7d408eec59.png",
"modeId": "254"
},
{
"submission_id": "226532",
"mode": "User Profiles",
"previewImage": "0f1ab8bb-bc8d-4a4e-bbff-b168ae9beafc.png",
"modeId": "116"
},
{
"submission_id": "269446",
"mode": "Newsletter Cookies",
"previewImage": "d1e0999e-e593-442a-b663-8d86e1d130f3.png",
"modeId": "255"
},
{
"submission_id": "224044",
"mode": "Blog Cards",
"previewImage": "46cbd617-7766-43ad-b208-8a39ac6cf476.png",
"modeId": "82"
},
{
"submission_id": "232365",
"mode": "Create Account",
"previewImage": "74a4e4b8-95c2-425a-9f7f-8db009cceb71.png",
"modeId": "463"
},
{
"submission_id": "269129",
"mode": "Freelancer Card",
"previewImage": "df4a6ef5-24e3-48e4-a16f-0e4f905ff0b3.png",
"modeId": "256"
},
{
"submission_id": "268824",
"mode": "Drag And Drop",
"previewImage": "9eac3aba-8c96-4100-9581-a29deb6ec0f0.png",
"modeId": "257"
},
{
"submission_id": "227846",
"mode": "Photo Gallery",
"previewImage": "6e1cd661-d56a-49ff-9b88-dcfb9a8c21b3.png",
"modeId": "131"
},
{
"submission_id": "268640",
"mode": "Delivery Landing",
"previewImage": "04d6e042-f09a-404c-b036-50b02b7e06de.png",
"modeId": "258"
},
{
"submission_id": "227973",
"mode": "Top Charts",
"previewImage": "6024823f-a63f-4b0b-b88b-6a4e6f102271.png",
"modeId": "133"
},
{
"submission_id": "268356",
"mode": "Confirm Message",
"previewImage": "aae4f6d7-11e0-4ee1-ad38-4e229ccab33b.png",
"modeId": "259"
},
{
"submission_id": "228081",
"mode": "Big Menu",
"previewImage": "050c4060-5225-49e5-97a7-89d53bf2d20e.png",
"modeId": "135"
},
{
"submission_id": "268169",
"mode": "Account Menu",
"previewImage": "43410ad3-e2f0-4f3a-a8df-c485cf74d2b5.png",
"modeId": "260"
},
{
"submission_id": "223844",
"mode": "Job List",
"previewImage": "cc82efad-9352-4c3d-943a-86cca6c3df12.png",
"modeId": "80"
},
{
"submission_id": "224184",
"mode": "Blog Widgets",
"previewImage": "f3ef573b-917a-452b-9e6c-82a826d611f7.png",
"modeId": "85"
},
{
"submission_id": "234129",
"mode": "Newsletter List",
"previewImage": "7561b3ba-71ec-455a-be2f-cd0f72a12a48.png",
"modeId": "449"
},
{
"submission_id": "235238",
"mode": "Reviews #1",
"previewImage": "d5a95416-6f68-4f2f-8352-846128e5b43b.png",
"modeId": "494"
},
{
"submission_id": "228681",
"mode": "Reviews #2",
"previewImage": "25b047c1-c4ee-4fa4-9205-0969b90065a7.png",
"modeId": "500"
},
{
"submission_id": "267990",
"mode": "Traffic Chart",
"previewImage": "99bdd6a6-b7a7-42a0-a484-f536f51797f9.png",
"modeId": "261"
},
{
"submission_id": "267905",
"mode": "Simple User Cards",
"previewImage": "9f255e0d-5ae4-4d98-b6cc-5b9752665a2c.png",
"modeId": "262"
},
{
"submission_id": "267633",
"mode": "Purple Login",
"previewImage": "2eae30fe-7ca5-4f5c-ac9d-f4ba9c02b096.png",
"modeId": "263"
},
{
"submission_id": "227352",
"mode": "Weather App",
"previewImage": "45062766-f534-412c-b82d-3593183480bd.png",
"modeId": "124"
},
{
"submission_id": "267599",
"mode": "Onboarding 4",
"previewImage": "9e29934d-481b-4401-b3be-d6b3d040d529.png",
"modeId": "264"
},
{
"submission_id": "267450",
"mode": "Double Popups",
"previewImage": "4d85bdf4-0a42-4a1c-96ff-f3fb3cd01268.png",
"modeId": "265"
},
{
"submission_id": "229821",
"mode": "Agency Search",
"previewImage": "1b409b2d-2ece-4193-a421-cb696ec43d0e.png",
"modeId": "488"
},
{
"submission_id": "228419",
"mode": "Neumorphic Ui",
"previewImage": "e7bb59f1-9dc3-468d-a801-27081c8d8559.png",
"modeId": "139"
},
{
"submission_id": "267227",
"mode": "Cart Details",
"previewImage": "aaf635e9-f697-4803-bb3f-7f3d86d612da.png",
"modeId": "266"
},
{
"submission_id": "230460",
"mode": "Box Layout",
"previewImage": "35fedd0c-8072-4f12-acb8-80bfd10384d9.png",
"modeId": "483"
},
{
"submission_id": "224194",
"mode": "Feedback Form",
"previewImage": "978c013a-441a-4820-932a-dafe8ec122a1.png",
"modeId": "86"
},
{
"submission_id": "228852",
"mode": "Services Section",
"previewImage": "509fcbbd-b200-4586-b31c-259f431e9089.png",
"modeId": "143"
},
{
"submission_id": "229505",
"mode": "Features List",
"previewImage": "3cb8f87f-1a9f-4ca8-9243-a4f5d62479f9.png",
"modeId": "149"
},
{
"submission_id": "235193",
"mode": "Links Section 2",
"previewImage": "db927eda-ed96-4192-a947-5132997d46bb.png",
"modeId": "438"
},
{
"submission_id": "229377",
"mode": "Donate Card",
"previewImage": "5362c6b9-e8de-45d2-8eb9-c0373ecb6b28.png",
"modeId": "148"
},
{
"submission_id": "231197",
"mode": "Search Suggestions",
"previewImage": "1fdb30e7-e20c-4f5a-86e4-931d4451660d.png",
"modeId": "474"
},
{
"submission_id": "267184",
"mode": "Book List",
"previewImage": "b26dc261-b706-49be-8f03-3b49f19b5384.png",
"modeId": "267"
},
{
"submission_id": "227770",
"mode": "Notes Card",
"previewImage": "dee240d8-90c6-4471-9fd7-a2d41c79ab51.png",
"modeId": "130"
},
{
"submission_id": "224924",
"mode": "Sign in Form",
"previewImage": "f681af95-8dfa-447d-a74b-4634b5ea6848.png",
"modeId": "97"
},
{
"submission_id": "233499",
"mode": "Blog Cards 3",
"previewImage": "2672b44c-9b62-4559-a2db-3b73e705ba40.png",
"modeId": "455"
},
{
"submission_id": "225904",
"mode": "Mega Menu",
"previewImage": "5c69d3d4-a8e0-4026-b3b2-8082afeb33e3.png",
"modeId": "109"
},
{
"submission_id": "226389",
"mode": "Users Card #1",
"previewImage": "fa7a8e62-d9cb-4c90-9363-397b545f3e78.png",
"modeId": "501"
},
{
"submission_id": "233832",
"mode": "Date Picker",
"previewImage": "325f58b0-9f37-477d-a940-6f4d3ce42d9f.png",
"modeId": "452"
},
{
"submission_id": "267029",
"mode": "Blue Cards",
"previewImage": "e202bb54-b0bc-4a81-a045-714abccbad50.png",
"modeId": "268"
},
{
"submission_id": "223567",
"mode": "Testimonials #1",
"previewImage": "451d83ba-ba11-4756-b65e-2de93a81d2a6.png",
"modeId": "504"
},
{
"submission_id": "228508",
"mode": "Onboarding",
"previewImage": "d05931fa-d048-44e0-a6b7-5a186133d15f.png",
"modeId": "140"
},
{
"submission_id": "223588",
"mode": "Signup Form #1",
"previewImage": "41efc613-ee37-4d7d-bcb8-4fdebf09d0cb.png",
"modeId": "503"
},
{
"submission_id": "231019",
"mode": "Menu",
"previewImage": "1d485c0c-5eef-44ec-a049-9dda60b9d07f.png",
"modeId": "477"
},
{
"submission_id": "229210",
"mode": "Activity Feed",
"previewImage": "8fd0763d-251b-4cf5-b57c-51de502d06dd.png",
"modeId": "146"
},
{
"submission_id": "226856",
"mode": "Features",
"previewImage": "995d2a0f-a74a-446c-9f12-0f0a6f2ca7d0.png",
"modeId": "119"
},
{
"submission_id": "266877",
"mode": "Achievements",
"previewImage": "5f5601ea-cca0-4f41-a1b8-2fd5e76ce299.png",
"modeId": "269"
},
{
"submission_id": "227415",
"mode": "Account Popup",
"previewImage": "d757a323-3f48-4bbc-a398-b6b910922896.png",
"modeId": "125"
},
{
"submission_id": "231050",
"mode": "Product Page",
"previewImage": "93e002f9-12ad-4da5-8147-52139aafe276.png",
"modeId": "476"
},
{
"submission_id": "266722",
"mode": "Event Schedule",
"previewImage": "355ae34f-36db-4623-8224-137afcde385a.png",
"modeId": "270"
},
{
"submission_id": "266569",
"mode": "Wishlist",
"previewImage": "7cb3234b-1012-40e6-b608-37d0b55f4a17.png",
"modeId": "271"
},
{
"submission_id": "230632",
"mode": "Cancel Form",
"previewImage": "467182b6-72a6-4840-8db4-f0efb611650e.png",
"modeId": "481"
},
{
"submission_id": "266496",
"mode": "Quiz App",
"previewImage": "c3e20b52-3d0c-4bba-87fe-09c346911a61.png",
"modeId": "272"
},
{
"submission_id": "224393",
"mode": "Pagination 2",
"previewImage": "05c85855-3515-40be-911e-027fe9dd8b90.png",
"modeId": "88"
},
{
"submission_id": "223243",
"mode": "Mobile Menu",
"previewImage": "45d001d5-6ae7-4f6e-a200-b16bb468c54a.png",
"modeId": "61"
},
{
"submission_id": "233395",
"mode": "Authentication",
"previewImage": "586da44e-dfb1-4242-b5b7-568b2e4575e9.png",
"modeId": "456"
},
{
"submission_id": "266224",
"mode": "Pricing Table 4",
"previewImage": "91c34968-9cc8-49d0-875d-e9ac5333d9bb.png",
"modeId": "273"
},
{
"submission_id": "229117",
"mode": "Accordion 2",
"previewImage": "2fca9e4d-ba7a-4a45-a099-fcb559e38ce0.png",
"modeId": "145"
},
{
"submission_id": "234021",
"mode": "Messages Box",
"previewImage": "75f09ff0-a23d-4aea-b0ec-3628a23d2b51.png",
"modeId": "450"
},
{
"submission_id": "231826",
"mode": "Help Center #1",
"previewImage": "ab005242-72f2-440d-86f4-f49324ca4f35.png",
"modeId": "496"
},
{
"submission_id": "266183",
"mode": "Follow List",
"previewImage": "207f86f7-b951-45d1-b5df-38a13e7e17f0.png",
"modeId": "274"
},
{
"submission_id": "233604",
"mode": "Contacts Table",
"previewImage": "5545888a-98d1-4a7e-9669-d9db1e6e2d82.png",
"modeId": "454"
},
{
"submission_id": "227568",
"mode": "Countdown",
"previewImage": "a20bdacd-daa2-437a-87d1-4e9e716f1ed3.png",
"modeId": "127"
},
{
"submission_id": "266003",
"mode": "E-Ticket",
"previewImage": "a9193512-a5de-4a5d-b62a-b6e5c1e58f1c.png",
"modeId": "275"
},
{
"submission_id": "225248",
"mode": "Book Trip",
"previewImage": "c6f199ff-9fff-4e5d-9981-f207270aae86.png",
"modeId": "101"
},
{
"submission_id": "231717",
"mode": "Get Started",
"previewImage": "6b1c813a-000b-42c3-9dc4-59e603fe3570.png",
"modeId": "469"
},
{
"submission_id": "265817",
"mode": "Custom Form Elements",
"previewImage": "d04a4ca6-5de6-4407-8fdd-b4287f547c11.png",
"modeId": "276"
},
{
"submission_id": "223355",
"mode": "Expenses Graph",
"previewImage": "1c446a53-2aa6-4beb-b5c9-fbd6b520c122.png",
"modeId": "75"
},
{
"submission_id": "223301",
"mode": "Leaderboard #1",
"previewImage": "1436ece1-f1af-49be-9b1c-30a888247dc6.png",
"modeId": "505"
},
{
"submission_id": "265596",
"mode": "Countdown 2",
"previewImage": "7047c171-c72d-4235-baab-0d41b62565ba.png",
"modeId": "277"
},
{
"submission_id": "265482",
"mode": "Smart Bulb",
"previewImage": "23e4c486-5e08-4084-b899-5d6f528358b9.png",
"modeId": "278"
},
{
"submission_id": "265286",
"mode": "Reminder App",
"previewImage": "4387e581-f39b-406a-8c94-57e45e6cadf6.png",
"modeId": "279"
},
{
"submission_id": "230755",
"mode": "Email Settings",
"previewImage": "de205d93-062a-4a2d-853d-105f62bb5b60.png",
"modeId": "480"
},
{
"submission_id": "232791",
"mode": "Report",
"previewImage": "e502aa0a-c0e7-4432-b7fe-68aa9c87d6ed.png",
"modeId": "460"
},
{
"submission_id": "265063",
"mode": "Pricing Crop",
"previewImage": "368934a9-c290-48ff-8521-3fe8ed3e941a.png",
"modeId": "280"
},
{
"submission_id": "225042",
"mode": "Background Pattern",
"previewImage": "d38c2ff5-0a37-4618-9847-597863d1668f.png",
"modeId": "98"
},
{
"submission_id": "265003",
"mode": "Post Card 2",
"previewImage": "441c629a-1238-44e0-985f-39c26e92d3e9.png",
"modeId": "281"
},
{
"submission_id": "264720",
"mode": "Onboarding 2",
"previewImage": "29564590-4f30-46e7-8e94-cdc27ee85ab8.png",
"modeId": "282"
},
{
"submission_id": "264416",
"mode": "Halloween",
"previewImage": "8cb9d932-94fc-4615-be7a-e9367804eb74.png",
"modeId": "283"
},
{
"submission_id": "232574",
"mode": "Free Apis",
"previewImage": "79f5b1bf-405d-446d-86f2-948dc88cf8d1.png",
"modeId": "461"
},
{
"submission_id": "232672",
"mode": "Leaderboard #2",
"previewImage": "3398458f-5e18-41e9-b530-3cfc30ff5aeb.png",
"modeId": "495"
},
{
"submission_id": "230083",
"mode": "Stats Card",
"previewImage": "6a85f85c-c9a7-4ff2-ae59-2bab53b61375.png",
"modeId": "485"
},
{
"submission_id": "264252",
"mode": "Creative Dropdown",
"previewImage": "44346d1b-2f4c-40a2-b8d4-f76a1470a87b.png",
"modeId": "284"
},
{
"submission_id": "264137",
"mode": "Trees Community",
"previewImage": "8bc3aaba-9ba5-443b-915f-d8b62f6d0641.png",
"modeId": "285"
},
{
"submission_id": "264025",
"mode": "Settings Modal",
"previewImage": "b9cfc545-93d5-4a3c-8176-a6a83fcefc4d.png",
"modeId": "286"
},
{
"submission_id": "227495",
"mode": "Analytics Chart",
"previewImage": "3d344225-a5e9-4673-b733-9afc9d874681.png",
"modeId": "126"
},
{
"submission_id": "229553",
"mode": "Help Center #2",
"previewImage": "b50e5366-6d8b-4b5e-b06f-d1326706a8d2.png",
"modeId": "499"
},
{
"submission_id": "232945",
"mode": "Share Link",
"previewImage": "774b7ad6-120a-4ba6-b1b8-1c46b69ece56.png",
"modeId": "459"
},
{
"submission_id": "263875",
"mode": "Pro Profile",
"previewImage": "c0af09e3-aa79-48db-822a-0e2debe0e4f4.png",
"modeId": "287"
},
{
"submission_id": "232028",
"mode": "Testimonials 2",
"previewImage": "7f4e2b95-0803-4fe6-8db8-c8ad0eebe4d5.png",
"modeId": "467"
},
{
"submission_id": "234777",
"mode": "Subscription Popup",
"previewImage": "6751b95b-7e0c-4efa-ab06-8de9d38e8a8c.png",
"modeId": "442"
},
{
"submission_id": "225978",
"mode": "Music Player",
"previewImage": "6c80cad9-df48-4a2c-a76a-5b4deecef0bc.png",
"modeId": "59"
},
{
"submission_id": "263518",
"mode": "Profile Dropdown",
"previewImage": "fd751fe6-2c54-4a23-9290-323e900a1192.png",
"modeId": "288"
},
{
"submission_id": "230562",
"mode": "Booking",
"previewImage": "2fb6cda8-1e09-4384-a0f1-8c9560a9c06e.png",
"modeId": "482"
},
{
"submission_id": "234227",
"mode": "Order Placed",
"previewImage": "43302822-c023-4717-8c81-32b0bdadbb59.png",
"modeId": "448"
},
{
"submission_id": "263496",
"mode": "Onboarding 3",
"previewImage": "1b967adf-a199-445f-b7ab-be4a75cbdb1a.png",
"modeId": "289"
},
{
"submission_id": "225493",
"mode": "Calendar 2",
"previewImage": "69bcd0bb-9b7d-4cf3-8e86-cb164002cc24.png",
"modeId": "63"
},
{
"submission_id": "224244",
"mode": "Movie Card",
"previewImage": "bf5a3d93-bb83-4648-baae-23f951c154b2.png",
"modeId": "57"
},
{
"submission_id": "225648",
"mode": "App Card",
"previewImage": "f7b9acd6-9031-4949-ae86-fa28a3af6611.png",
"modeId": "105"
},
{
"submission_id": "223274",
"mode": "Cart Item",
"previewImage": "4a507646-a00e-4f6a-8eed-14309f59b4e5.png",
"modeId": "52"
},
{
"submission_id": "263133",
"mode": "Message Box",
"previewImage": "2da01921-3886-44b7-bad7-09b09c4cdb19.png",
"modeId": "290"
},
{
"submission_id": "223968",
"mode": "Article Page",
"previewImage": "22fd9592-6017-4d39-89da-bdf2fd2811b4.png",
"modeId": "49"
},
{
"submission_id": "224419",
"mode": "Poll",
"previewImage": "1e0a495c-1750-4542-a98a-234a2e293ba8.png",
"modeId": "89"
},
{
"submission_id": "223656",
"mode": "Profile Header",
"previewImage": "389b32e5-1100-4e1e-9efa-b37fcb220c80.png",
"modeId": "51"
},
{
"submission_id": "223914",
"mode": "Password Field",
"previewImage": "c436cfeb-8d2c-4e1e-be97-c0b76cd0487d.png",
"modeId": "46"
},
{
"submission_id": "262992",
"mode": "Timeline 2",
"previewImage": "0fa44970-85dd-46b9-95a2-89fc52514ea8.png",
"modeId": "291"
},
{
"submission_id": "228313",
"mode": "Login Card",
"previewImage": "76a2d403-0e85-4d0a-825a-94947714cecb.png",
"modeId": "38"
},
{
"submission_id": "262688",
"mode": "Promo Section",
"previewImage": "10a62efb-7d04-43b6-bd0f-3473e7c53c59.png",
"modeId": "292"
},
{
"submission_id": "227080",
"mode": "Project Card",
"previewImage": "c54c44cf-60d5-4375-b680-40cf08c6c855.png",
"modeId": "56"
},
{
"submission_id": "224957",
"mode": "Signup Form #2",
"previewImage": "75d9c71d-ccbb-4b6a-aa25-9a1a4679f65a.png",
"modeId": "502"
},
{
"submission_id": "262627",
"mode": "Price Details",
"previewImage": "27b1d7d2-feb0-4b1f-a372-eb4b6252b206.png",
"modeId": "293"
},
{
"submission_id": "223345",
"mode": "Friend Request",
"previewImage": "a854b0b7-748e-4a7a-9e97-9e5fa1156a8c.png",
"modeId": "53"
},
{
"submission_id": "223389",
"mode": "Birthday List",
"previewImage": "11c95f94-3733-483d-a6a9-5f5c5c5b377c.png",
"modeId": "39"
},
{
"submission_id": "262306",
"mode": "Menu 2",
"previewImage": "9403e044-3a9c-4e90-a82f-5bc60c3a3082.png",
"modeId": "294"
},
{
"submission_id": "229702",
"mode": "Table",
"previewImage": "2a7a2e90-c3e8-4e77-aa77-1f883b35f156.png",
"modeId": "490"
},
{
"submission_id": "262100",
"mode": "Management Dashboard",
"previewImage": "cb8c518c-b1d3-4474-b625-3cfae9e40818.png",
"modeId": "295"
},
{
"submission_id": "235483",
"mode": "Signup Form 3",
"previewImage": "a5fe9d60-4138-413d-8f88-4ffd4c0122ef.png",
"modeId": "435"
},
{
"submission_id": "230286",
"mode": "Timeline",
"previewImage": "eab8ce2a-2c89-4bd1-9c20-347ef25dbba8.png",
"modeId": "484"
},
{
"submission_id": "262018",
"mode": "Invite Cards",
"previewImage": "f4adf6d8-415f-4adf-a058-ded87c0b9952.png",
"modeId": "296"
},
{
"submission_id": "261845",
"mode": "Forum Components",
"previewImage": "6e25a86d-9c28-44e3-af17-c19c198df280.png",
"modeId": "297"
},
{
"submission_id": "229852",
"mode": "Post Card",
"previewImage": "273e9ef3-06f7-4096-bdab-f74c024f2037.png",
"modeId": "487"
},
{
"submission_id": "231533",
"mode": "Age Stats",
"previewImage": "80014457-d368-4c4b-add0-067eeac77585.png",
"modeId": "471"
},
{
"submission_id": "231361",
"mode": "To Do",
"previewImage": "4ff5d402-5f2c-4ee2-b473-454a4e0eba13.png",
"modeId": "472"
},
{
"submission_id": "261447",
"mode": "Conferences Page",
"previewImage": "7c59f202-2a2d-41a7-8ee6-8da1bb644ce3.png",
"modeId": "298"
},
{
"submission_id": "261356",
"mode": "Simple Cards",
"previewImage": "a2ce5be5-f5a6-4f8c-84ae-1d045805a991.png",
"modeId": "299"
},
{
"submission_id": "261027",
"mode": "Pricing Components",
"previewImage": "5f5026d7-d49e-4f40-9b56-a4594f30eee8.png",
"modeId": "300"
},
{
"submission_id": "260801",
"mode": "Pricing Cards 5",
"previewImage": "3f923442-dab0-4da9-b12e-ead0fa97e6b1.png",
"modeId": "301"
},
{
"submission_id": "260605",
"mode": "Menu 3",
"previewImage": "aeadebb8-4330-41c2-bebd-d17c70df73ce.png",
"modeId": "302"
},
{
"submission_id": "230892",
"mode": "Lesson Feedback",
"previewImage": "72e19302-0ec7-4e20-ad6b-8580ae977aa4.png",
"modeId": "478"
},
{
"submission_id": "226197",
"mode": "Song Card",
"previewImage": "3ec2ce33-5951-4479-a8ca-6269cf9391f6.png",
"modeId": "112"
},
{
"submission_id": "260311",
"mode": "Landing Page 2",
"previewImage": "c5d2d3be-e517-4623-9267-85163425690a.png",
"modeId": "303"
},
{
"submission_id": "260008",
"mode": "Groups",
"previewImage": "2e2d4b54-7901-4c3d-aa7e-3856c31e119b.png",
"modeId": "304"
},
{
"submission_id": "223709",
"mode": "Pricing Table",
"previewImage": "5b591d23-709a-45ba-9bb2-b20710e2da6c.png",
"modeId": "50"
},
{
"submission_id": "259945",
"mode": "Store Location",
"previewImage": "bda34a9d-92a7-4987-ba09-a0a08df29611.png",
"modeId": "305"
},
{
"submission_id": "259796",
"mode": "Retro Notifications",
"previewImage": "26fd5570-b27b-4323-ad34-fa1a8ea8cc32.png",
"modeId": "306"
},
{
"submission_id": "233164",
"mode": "Subscribe",
"previewImage": "8781ecde-07b1-40a0-9f65-112f80f34dd1.png",
"modeId": "55"
},
{
"submission_id": "231265",
"mode": "Subscription",
"previewImage": "e0a51803-67fe-4776-b1af-5727956939e8.png",
"modeId": "473"
},
{
"submission_id": "259617",
"mode": "Retro Modal",
"previewImage": "dafc7ce6-1c6b-4512-8909-05aaa43dff9e.png",
"modeId": "307"
},
{
"submission_id": "228570",
"mode": "Progress Checks",
"previewImage": "8eecdb9d-63f6-4621-88f3-e536464491ae.png",
"modeId": "141"
},
{
"submission_id": "223186",
"mode": "Social Login",
"previewImage": "3103072f-905f-414d-8522-6f0cca972284.png",
"modeId": "45"
},
{
"submission_id": "259498",
"mode": "Retro Messages",
"previewImage": "5c43c39d-df65-47ca-ae12-307e9215663c.png",
"modeId": "308"
},
{
"submission_id": "230177",
"mode": "Testimonials #2",
"previewImage": "8963d0f2-bc96-4bcd-a281-2e39b945f335.png",
"modeId": "497"
},
{
"submission_id": "230005",
"mode": "Simple Pricing",
"previewImage": "93b8dc47-80fd-47c2-8af3-b1a9695ac2c5.png",
"modeId": "486"
},
{
"submission_id": "230326",
"mode": "Toasts",
"previewImage": "68b2779d-e07d-4568-8fbb-cb0d45ac011b.png",
"modeId": "41"
},
{
"submission_id": "234511",
"mode": "Sign In Form 2",
"previewImage": "8e02d3dd-b2ce-4beb-9a43-968fcde2160d.png",
"modeId": "445"
},
{
"submission_id": "259424",
"mode": "Retro Flash",
"previewImage": "3656bf5a-31da-4453-9038-d4e00c910bde.png",
"modeId": "309"
},
{
"submission_id": "225164",
"mode": "Alerts",
"previewImage": "d721b8a5-0295-41e4-8fc9-d5b65090eaaa.png",
"modeId": "100"
},
{
"submission_id": "259279",
"mode": "Mobile Movie App",
"previewImage": "46971b1d-402f-4e1b-8c61-1188564e4255.png",
"modeId": "310"
},
{
"submission_id": "259026",
"mode": "Inbox List",
"previewImage": "3add14be-3f93-4513-bc24-eaa23a711351.png",
"modeId": "311"
},
{
"submission_id": "226131",
"mode": "Search Bar",
"previewImage": "805f255a-de37-459d-bba0-2ec8d65e571e.png",
"modeId": "111"
},
{
"submission_id": "236786",
"mode": "Likes Dislikes Stats",
"previewImage": "48da8564-e614-457d-83dd-df98d599588a.png",
"modeId": "416"
},
{
"submission_id": "258828",
"mode": "Booking Calendar",
"previewImage": "2c113e12-8e09-4c0d-bac8-522b5c3bbc2e.png",
"modeId": "312"
},
{
"submission_id": "231909",
"mode": "Meeting Feedback",
"previewImage": "9d57f201-3ede-4efa-8817-b22e37104d68.png",
"modeId": "468"
},
{
"submission_id": "231625",
"mode": "Breadcrumbs",
"previewImage": "9a433932-adf2-47c4-bf87-55b3f6f46fa5.png",
"modeId": "470"
},
{
"submission_id": "234337",
"mode": "Order Placed 2",
"previewImage": "d0de975b-eb5a-4222-a3b0-c7069e0c5e86.png",
"modeId": "447"
},
{
"submission_id": "235335",
"mode": "Share Article Modal",
"previewImage": "ebbfa21e-d6a8-4887-a742-a5fd3160156d.png",
"modeId": "437"
},
{
"submission_id": "258730",
"mode": "User Card 2",
"previewImage": "536385e0-a594-43ac-b194-666cee2def6a.png",
"modeId": "313"
},
{
"submission_id": "258659",
"mode": "Users Card #2",
"previewImage": "7d534548-ba10-4165-84d2-2fed581b9e77.png",
"modeId": "492"
},
{
"submission_id": "233273",
"mode": "404 Page",
"previewImage": "bcba2965-4b8a-4d46-96ca-88ff0512e150.png",
"modeId": "457"
},
{
"submission_id": "234668",
"mode": "Subscribe 2",
"previewImage": "240020ca-8808-4d84-bf71-62d6936135d9.png",
"modeId": "443"
},
{
"submission_id": "258525",
"mode": "Mobile Movie Card",
"previewImage": "c5792b78-3d63-4e41-85b0-ecdec88c7df9.png",
"modeId": "314"
},
{
"submission_id": "258449",
"mode": "Menu Card",
"previewImage": "a3a9be07-cc47-44de-b56a-2c280a039f6b.png",
"modeId": "315"
},
{
"submission_id": "235398",
"mode": "Share Link 2",
"previewImage": "7ac5eed8-2d27-4f1e-ac68-2b6fc657adc4.png",
"modeId": "436"
},
{
"submission_id": "258277",
"mode": "Challenges",
"previewImage": "e555adc4-8154-4b7d-add7-1e1eabed2d42.png",
"modeId": "316"
},
{
"submission_id": "258060",
"mode": "Workout Tracker",
"previewImage": "a1a3094a-f2c3-4edc-a358-d67ac32bc2b2.png",
"modeId": "317"
},
{
"submission_id": "257900",
"mode": "Weather",
"previewImage": "acabd425-6bee-4d59-82a1-173b321b3377.png",
"modeId": "318"
},
{
"submission_id": "257734",
"mode": "Wallet Balance",
"previewImage": "aab2f3e1-7c77-458e-801f-91c158aa2f59.png",
"modeId": "319"
},
{
"submission_id": "257580",
"mode": "Testimonials Grid",
"previewImage": "7deef78e-0b59-4d07-a77f-57cb70aa3dd1.png",
"modeId": "320"
},
{
"submission_id": "257439",
"mode": "Shopping Cart #2",
"previewImage": "5e5e50c8-d648-4c25-bc00-f66a67de9982.png",
"modeId": "493"
},
{
"submission_id": "257334",
"mode": "Settings Retro",
"previewImage": "7f5522ba-9005-452c-897a-31bb1c90a820.png",
"modeId": "322"
},
{
"submission_id": "224536",
"mode": "Progress Bar",
"previewImage": "808346cf-4d5a-49c1-8964-aea3d7a287f2.png",
"modeId": "91"
},
{
"submission_id": "257240",
"mode": "Progress Bar 2",
"previewImage": "858ca4e6-7d97-4537-9ac6-5eb6b3b9b6f4.png",
"modeId": "323"
},
{
"submission_id": "232443",
"mode": "Events",
"previewImage": "9475dad7-cd82-421f-83d1-87115d01f7b8.png",
"modeId": "462"
},
{
"submission_id": "257039",
"mode": "Pricing 3",
"previewImage": "5331202d-b6fa-4f66-bce4-1f5bb3090d77.png",
"modeId": "324"
},
{
"submission_id": "256952",
"mode": "Photograph Profile",
"previewImage": "639ad46f-1b3e-4896-a6d9-790ef17be38c.png",
"modeId": "65"
},
{
"submission_id": "256703",
"mode": "Pagination 4",
"previewImage": "2c2fa6fe-21cb-48aa-ae53-a8f529f12454.png",
"modeId": "325"
},
{
"submission_id": "256627",
"mode": "Pagination 3",
"previewImage": "490c3b5d-317a-4610-8e87-4adc7d0344f3.png",
"modeId": "326"
},
{
"submission_id": "256510",
"mode": "Music Player 2",
"previewImage": "2aef3a92-1f60-4c77-9ba7-91b9464c08f6.png",
"modeId": "327"
},
{
"submission_id": "256375",
"mode": "Mobile Pad",
"previewImage": "90f59ab9-59c8-4de4-846f-8a32cfca6c07.png",
"modeId": "328"
},
{
"submission_id": "256061",
"mode": "Leaderboard 3",
"previewImage": "a27f488e-6ea3-469d-9011-1867aa00535b.png",
"modeId": "329"
},
{
"submission_id": "230853",
"mode": "Image Search",
"previewImage": "95edeead-f076-40c7-8442-81d3cb530b2b.png",
"modeId": "479"
},
{
"submission_id": "255922",
"mode": "Image Zoom",
"previewImage": "494534d9-1e3a-45d3-a931-77685371b26e.png",
"modeId": "330"
},
{
"submission_id": "255864",
"mode": "Halloween Countdown",
"previewImage": "808eb048-0b72-4228-8caf-5f24ca5936e9.png",
"modeId": "331"
},
{
"submission_id": "255630",
"mode": "Fullpage Slider",
"previewImage": "056cc5bc-96a9-461d-a408-4a521e86e447.png",
"modeId": "332"
},
{
"submission_id": "255513",
"mode": "Food Menu",
"previewImage": "e34e9f05-674f-4db0-8f9a-763cd1f791eb.png",
"modeId": "333"
},
{
"submission_id": "255269",
"mode": "File Upload",
"previewImage": "ec34c009-07bb-4ede-949f-9297a69cd312.png",
"modeId": "334"
},
{
"submission_id": "255102",
"mode": "Course Card",
"previewImage": "a1c27e26-061f-40e4-bf30-561655ff09cc.png",
"modeId": "335"
},
{
"submission_id": "227261",
"mode": "User Select",
"previewImage": "6212e3a8-ceb8-4d52-a76d-46fb3ef620c7.png",
"modeId": "123"
},
{
"submission_id": "254910",
"mode": "Car Interface",
"previewImage": "de10621d-2420-4eb2-b612-40045e591858.png",
"modeId": "336"
},
{
"submission_id": "236858",
"mode": "Member Invite",
"previewImage": "72c957c4-414a-4edc-bbbe-c1883767e5f7.png",
"modeId": "415"
},
{
"submission_id": "254603",
"mode": "Testimonials 3",
"previewImage": "09e477d6-9a65-4455-8bc9-8e2423d63520.png",
"modeId": "337"
},
{
"submission_id": "254533",
"mode": "Reviews 3",
"previewImage": "0897a0bc-571f-49b9-a2c2-1146cb82c557.png",
"modeId": "338"
},
{
"submission_id": "254143",
"mode": "Notifications 3",
"previewImage": "adcea257-71b6-476f-b826-90d8ca2fb249.png",
"modeId": "339"
},
{
"submission_id": "253767",
"mode": "Social Ui Kit",
"previewImage": "207e4273-5ba3-4984-8539-e71b11658c88.png",
"modeId": "66"
},
{
"submission_id": "253463",
"mode": "Select Interest",
"previewImage": "b24c95e8-fac7-4564-bf0f-60afec1217f8.png",
"modeId": "341"
},
{
"submission_id": "253293",
"mode": "Purple Messages",
"previewImage": "c8178f34-f595-4923-8a5d-1543a1ec41d9.png",
"modeId": "44"
},
{
"submission_id": "253041",
"mode": "Playlist",
"previewImage": "8b752cf9-ffdb-4284-859d-5a34d81b57e1.png",
"modeId": "342"
},
{
"submission_id": "252742",
"mode": "Mobile Movie Ad",
"previewImage": "4248ce46-41d4-43d8-b142-66169331bd6c.png",
"modeId": "343"
},
{
"submission_id": "252469",
"mode": "Games List",
"previewImage": "4dd572a2-b8f2-4685-a6bf-f8701a8eb43b.png",
"modeId": "344"
},
{
"submission_id": "252260",
"mode": "Check In",
"previewImage": "33a29b2f-2b55-46a1-afc0-e3b94f25a5cc.png",
"modeId": "345"
},
{
"submission_id": "251882",
"mode": "Watch Giveaway",
"previewImage": "d7bb3899-0515-489d-9fd8-6ddeab24ef90.png",
"modeId": "346"
},
{
"submission_id": "251625",
"mode": "Ui Kit",
"previewImage": "19df80b0-fe9e-4f2c-bd68-8c78101a2f63.png",
"modeId": "347"
},
{
"submission_id": "236665",
"mode": "Time Picker",
"previewImage": "0a6e5abd-ad70-4dae-b219-4ed8891819a4.png",
"modeId": "419"
},
{
"submission_id": "251322",
"mode": "App Notifications",
"previewImage": "a937d41d-3be8-4c58-98b2-8180b3377fbe.png",
"modeId": "348"
},
{
"submission_id": "251106",
"mode": "Upsell Features",
"previewImage": "4fd756aa-aac5-431c-aa23-2530d39c2365.png",
"modeId": "349"
},
{
"submission_id": "250690",
"mode": "Tv App",
"previewImage": "167de6a7-cb49-429d-b913-79f9015847a0.png",
"modeId": "350"
},
{
"submission_id": "250296",
"mode": "Reviews 2",
"previewImage": "b280307d-6203-4494-bbf0-76d8eab3a78f.png",
"modeId": "351"
},
{
"submission_id": "250283",
"mode": "Radio App",
"previewImage": "e468de96-efcd-4df4-86e3-957ddf4af2b6.png",
"modeId": "352"
},
{
"submission_id": "250056",
"mode": "Promo Card",
"previewImage": "a76292ef-4b57-4481-bf7c-d74ca2408f8c.png",
"modeId": "353"
},
{
"submission_id": "249750",
"mode": "Gift Membership",
"previewImage": "64aa7468-7993-41dc-b537-c37daed455d2.png",
"modeId": "354"
},
{
"submission_id": "248907",
"mode": "Coffee Social Card",
"previewImage": "d1bc72fe-a1b2-4bfd-98aa-4e75ddc92e8e.png",
"modeId": "356"
},
{
"submission_id": "248594",
"mode": "Calendar 4",
"previewImage": "b622dc02-3d2d-4e07-a32d-b84eae075870.png",
"modeId": "357"
},
{
"submission_id": "248442",
"mode": "Calendar 3",
"previewImage": "386a819b-7eb2-4bb0-a945-7b30ec430f49.png",
"modeId": "358"
},
{
"submission_id": "248125",
"mode": "Book Card",
"previewImage": "07ad82f1-6a98-4cb1-b446-4de4560a2ccc.png",
"modeId": "359"
},
{
"submission_id": "247876",
"mode": "Accordion 4",
"previewImage": "612d452b-d4f4-4684-931d-97f04b2afc97.png",
"modeId": "360"
},
{
"submission_id": "232118",
"mode": "Accordion 3",
"previewImage": "5df7a2d0-5030-4ff2-95de-94d9262fe995.png",
"modeId": "466"
},
{
"submission_id": "247260",
"mode": "Subscribe Popup",
"previewImage": "907ab0d8-0b26-4e18-ab37-ddc5348f0533.png",
"modeId": "361"
},
{
"submission_id": "247057",
"mode": "Product Review",
"previewImage": "0c1940ce-e5ad-404d-9b1b-f889236c4803.png",
"modeId": "362"
},
{
"submission_id": "246787",
"mode": "Members Share",
"previewImage": "8845001f-923a-44c6-ba21-89feaf2d15d5.png",
"modeId": "363"
},
{
"submission_id": "246253",
"mode": "Glassy Profile",
"previewImage": "68b717e7-d648-4ea4-a018-b825f4624dfe.png",
"modeId": "364"
},
{
"submission_id": "245704",
"mode": "Glassy Landing",
"previewImage": "b01ae75c-4986-4ca5-b05e-0e112ed9b8e3.png",
"modeId": "365"
},
{
"submission_id": "245568",
"mode": "Editable Components",
"previewImage": "9f05c560-ea2e-48ab-9547-9df0a421d7c5.png",
"modeId": "366"
},
{
"submission_id": "245231",
"mode": "Download Status",
"previewImage": "b119c0a5-4858-4fa2-9eb6-3f7355305762.png",
"modeId": "367"
},
{
"submission_id": "244689",
"mode": "Buttons Kit",
"previewImage": "6f8473ac-6782-4190-9fc0-52b60924c20d.png",
"modeId": "368"
},
{
"submission_id": "244511",
"mode": "Big Footer 2",
"previewImage": "1b5fa004-0cdb-466e-aa4e-68841b12d464.png",
"modeId": "369"
},
{
"submission_id": "233684",
"mode": "Cookie Popup",
"previewImage": "a4cfb5c1-bfe5-42bc-9394-dd63ed3c5edb.png",
"modeId": "453"
},
{
"submission_id": "243976",
"mode": "Pricing Cards",
"previewImage": "a1e67ed7-c86b-4f19-a3f9-ee856e519052.png",
"modeId": "370"
},
{
"submission_id": "243396",
"mode": "Verification Code",
"previewImage": "8a32fc40-a290-4adc-8434-7d3ddc4fecd3.png",
"modeId": "371"
},
{
"submission_id": "243347",
"mode": "Tags",
"previewImage": "78c18942-fa20-4866-b2a2-840a73fc4baf.png",
"modeId": "372"
},
{
"submission_id": "229754",
"mode": "Accordion",
"previewImage": "94ad8504-fc64-4275-a299-50e5e974a3f6.png",
"modeId": "489"
},
{
"submission_id": "225440",
"mode": "Calendar",
"previewImage": "66111a2f-037a-4f69-8e7a-cca66072a66a.png",
"modeId": "103"
},
{
"submission_id": "243190",
"mode": "Notifications 2",
"previewImage": "e7be97a4-574a-4903-b0bf-dc056a58e72b.png",
"modeId": "373"
},
{
"submission_id": "227885",
"mode": "Switch",
"previewImage": "295d65b5-d23e-46af-ac27-0d8a2ebc3e7d.png",
"modeId": "132"
},
{
"submission_id": "243119",
"mode": "Member Subscriptions",
"previewImage": "71c75c89-a726-4e4d-bb9f-225318fd2aec.png",
"modeId": "374"
},
{
"submission_id": "243053",
"mode": "Meal Results",
"previewImage": "2a8e8da2-a4ae-4d10-a7ab-5fb7eb520ffd.png",
"modeId": "375"
},
{
"submission_id": "242935",
"mode": "Inputs",
"previewImage": "797dde25-50f6-4b21-9231-a8234c41c104.png",
"modeId": "376"
},
{
"submission_id": "229638",
"mode": "Multi Toggle",
"previewImage": "d87f246f-5c03-470f-b428-41b687fec4a6.png",
"modeId": "491"
},
{
"submission_id": "235007",
"mode": "Updates Card",
"previewImage": "057a5888-7104-4378-be99-676930aa1a4b.png",
"modeId": "440"
},
{
"submission_id": "242811",
"mode": "Events App",
"previewImage": "9bbd8cc3-c992-4321-89ba-93aac91b535f.png",
"modeId": "377"
},
{
"submission_id": "225088",
"mode": "Banner",
"previewImage": "b23012bf-105e-406e-807e-07dd47119dc1.png",
"modeId": "99"
},
{
"submission_id": "242625",
"mode": "Crypto Account",
"previewImage": "bfdf8074-1d4a-46ff-a056-fe453acc4511.png",
"modeId": "378"
},
{
"submission_id": "242486",
"mode": "Challenges List",
"previewImage": "eac481d3-9179-40bd-8aa9-0a6210535a94.png",
"modeId": "379"
},
{
"submission_id": "236744",
"mode": "Edit Account",
"previewImage": "81343dbb-e1e2-4fb2-a557-53e83bc5bcb0.png",
"modeId": "417"
},
{
"submission_id": "242420",
"mode": "Blog Cards 4",
"previewImage": "26bddf56-5206-41ed-b70d-7125ecd13788.png",
"modeId": "62"
},
{
"submission_id": "242171",
"mode": "Apps Card",
"previewImage": "13971b4d-7030-4890-a30d-81b02c9b8348.png",
"modeId": "43"
},
{
"submission_id": "242136",
"mode": "Timer",
"previewImage": "9f2a7339-bcc4-450f-afbb-63f69e33ddb2.png",
"modeId": "54"
},
{
"submission_id": "241971",
"mode": "Ticket Event",
"previewImage": "9950bba2-df71-4b61-baab-51a301035954.png",
"modeId": "380"
},
{
"submission_id": "241791",
"mode": "Style Guide",
"previewImage": "1521fb05-6628-4320-8aab-4c2894052580.png",
"modeId": "381"
},
{
"submission_id": "233048",
"mode": "Share Modal",
"previewImage": "8a1d156e-7870-49e5-b03c-f6225dfae533.png",
"modeId": "458"
},
{
"submission_id": "241654",
"mode": "Saas Landing",
"previewImage": "3836a183-dab0-42bb-9024-02751ba105de.png",
"modeId": "382"
},
{
"submission_id": "237147",
"mode": "Search Bar 2",
"previewImage": "95d87503-f6c6-4a69-a123-e4dc0c49a9b1.png",
"modeId": "413"
},
{
"submission_id": "241480",
"mode": "Press Page",
"previewImage": "d067aa6d-e5d6-4733-8cbd-dd53eaa2b5e8.png",
"modeId": "383"
},
{
"submission_id": "241439",
"mode": "Payment Method",
"previewImage": "830dc219-7900-451c-9a13-f51e5e5595b7.png",
"modeId": "384"
},
{
"submission_id": "241302",
"mode": "Moksha Coffee",
"previewImage": "89518f36-b99d-4668-bfcb-ae2a127149a8.png",
"modeId": "385"
},
{
"submission_id": "241201",
"mode": "Keyboard",
"previewImage": "6541b23c-5c56-44fc-8925-263e272f1c5b.png",
"modeId": "386"
},
{
"submission_id": "236236",
"mode": "Subscribe Modal",
"previewImage": "1fd646d9-0974-4bf6-ae21-9caf8406d891.png",
"modeId": "425"
},
{
"submission_id": "241019",
"mode": "Flight Booking",
"previewImage": "e3f6cb21-2efa-4bee-bad0-dae5393ffd40.png",
"modeId": "387"
},
{
"submission_id": "240833",
"mode": "Credit Card",
"previewImage": "12c446e5-7754-41f3-8ad1-c59eb6b0e4e4.png",
"modeId": "388"
},
{
"submission_id": "240729",
"mode": "Blog Kit",
"previewImage": "0d2b27eb-8691-4512-9f6c-82d40f7c7b7a.png",
"modeId": "389"
},
{
"submission_id": "240612",
"mode": "Arya Targets",
"previewImage": "5188c66c-0436-4dd3-bdab-1c22b4bdb545.png",
"modeId": "390"
},
{
"submission_id": "240533",
"mode": "Apps List 2",
"previewImage": "10afcab0-1b40-4067-a42a-8196eea9d12c.png",
"modeId": "391"
},
{
"submission_id": "236714",
"mode": "Device Stats",
"previewImage": "13b40e75-6b55-4f70-9038-9f28ec930cad.png",
"modeId": "418"
},
{
"submission_id": "240450",
"mode": "Sponsorship Pricing",
"previewImage": "52a9467e-4a3a-49de-9a4e-4ca800049570.png",
"modeId": "392"
},
{
"submission_id": "236516",
"mode": "Repositories List",
"previewImage": "502bae93-5490-4fcf-af1f-e843fb9c9060.png",
"modeId": "421"
},
{
"submission_id": "240249",
"mode": "Simple Testimonials",
"previewImage": "0f2512df-12d7-4e72-b6e6-ca9402698a39.png",
"modeId": "393"
},
{
"submission_id": "240091",
"mode": "Select Flight",
"previewImage": "d19a9885-9f4d-47ae-9e76-9da27a94697d.png",
"modeId": "394"
},
{
"submission_id": "223659",
"mode": "Collections List",
"previewImage": "540a691f-c15e-4531-8faf-c7186ec0012c.png",
"modeId": "58"
},
{
"submission_id": "239922",
"mode": "Order Summary",
"previewImage": "db08a988-c845-4c4b-a6cd-1e6b409d942f.png",
"modeId": "395"
},
{
"submission_id": "232184",
"mode": "Contact Card",
"previewImage": "5a056257-eff4-45a6-a2e9-ea1ad88c42e6.png",
"modeId": "465"
},
{
"submission_id": "239715",
"mode": "Notification Cards",
"previewImage": "4a4a44dc-c343-4bd7-a299-e8c3ed387a35.png",
"modeId": "396"
},
{
"submission_id": "239563",
"mode": "Conversations",
"previewImage": "3e246d04-a2af-40f8-a355-9dc3e37a7ba9.png",
"modeId": "397"
},
{
"submission_id": "239482",
"mode": "Sms Share",
"previewImage": "7adbf107-8b53-4e24-992b-795c0eac8caa.png",
"modeId": "398"
},
{
"submission_id": "239350",
"mode": "Radar Chart",
"previewImage": "d4fe1aef-31a9-41cf-a030-d3fac5579bef.png",
"modeId": "399"
},
{
"submission_id": "239301",
"mode": "Kanban 2",
"previewImage": "13cafb1b-41d9-4cb1-9f7b-31b0d33308c0.png",
"modeId": "400"
},
{
"submission_id": "239208",
"mode": "Get In Touch",
"previewImage": "85a50c64-5d9d-4f5d-a3b3-6d49c93ab2d1.png",
"modeId": "401"
},
{
"submission_id": "239010",
"mode": "Forgot Password",
"previewImage": "4fb4a318-d958-4895-b20d-c6e8f9f8e571.png",
"modeId": "402"
},
{
"submission_id": "238796",
"mode": "404 Error Page",
"previewImage": "fc895570-9e0c-460f-8231-61d21e2a7165.png",
"modeId": "42"
},
{
"submission_id": "238725",
"mode": "Time Picker 2",
"previewImage": "7c9838cc-af8a-4c48-8e5c-27b8e7d21863.png",
"modeId": "403"
},
{
"submission_id": "236905",
"mode": "Percentage Calculator",
"previewImage": "ef553dbf-9e9e-4624-9a90-2f4cc842812d.png",
"modeId": "414"
},
{
"submission_id": "238565",
"mode": "Side Panel",
"previewImage": "089ff078-e0f6-4968-97e0-10d14f89e730.png",
"modeId": "404"
},
{
"submission_id": "223817",
"mode": "Big Footer",
"previewImage": "5861c05a-7b1f-4d1e-abd0-1cb9bc3f754b.png",
"modeId": "79"
},
{
"submission_id": "238513",
"mode": "Profile Card",
"previewImage": "d070181e-d412-414a-9d21-d78d8d3dce29.png",
"modeId": "405"
},
{
"submission_id": "238408",
"mode": "Notifications",
"previewImage": "b7edf5cc-8847-40bc-9c9e-96ffd9b72c1e.png",
"modeId": "406"
},
{
"submission_id": "238269",
"mode": "Music App",
"previewImage": "b1a8eb42-d44a-4204-872e-ce368caec679.png",
"modeId": "407"
},
{
"submission_id": "238156",
"mode": "Colored Cards",
"previewImage": "5ddf17b7-bb78-4a64-9143-9011ad60586d.png",
"modeId": "408"
},
{
"submission_id": "237822",
"mode": "Announcements",
"previewImage": "2bc64915-d751-4c74-8c02-cd6e6675bb7d.png",
"modeId": "409"
},
{
"submission_id": "237769",
"mode": "Address Finder",
"previewImage": "22127367-bba3-4508-adc4-f30d4ca3a5cd.png",
"modeId": "410"
},
{
"submission_id": "237267",
"mode": "Support Survery",
"previewImage": "022b5106-4615-4bc4-be57-f0ffa51f9553.png",
"modeId": "412"
},
{
"submission_id": "236168",
"mode": "Recordings",
"previewImage": "0b4f4d1c-9047-41ff-a1f2-fb0236ea0342.png",
"modeId": "426"
},
{
"submission_id": "224766",
"mode": "Profile Tooltip",
"previewImage": "a3c4ca78-9859-4ee6-802c-46c818503413.png",
"modeId": "96"
},
{
"submission_id": "236054",
"mode": "Links Section",
"previewImage": "7c6a77d2-6ce7-4955-adbc-55566cf9c546.png",
"modeId": "427"
},
{
"submission_id": "236001",
"mode": "Info Section 2",
"previewImage": "3150734d-39a9-4f13-ac4f-3d0a964c95b2.png",
"modeId": "428"
},
{
"submission_id": "235938",
"mode": "Footer Ui",
"previewImage": "e8823bde-5b22-49bb-9a69-866043b8cc73.png",
"modeId": "429"
},
{
"submission_id": "235868",
"mode": "Feedback Widgets",
"previewImage": "38726642-ae34-4084-bf9d-daa56e6a4286.png",
"modeId": "430"
},
{
"submission_id": "235714",
"mode": "Date Picker 2",
"previewImage": "ccbc0eb1-abae-40b3-888d-f3f65fdf98fb.png",
"modeId": "432"
},
{
"submission_id": "235665",
"mode": "Tabbed Ui",
"previewImage": "9624093d-f9b2-43f3-b417-f2467016581e.png",
"modeId": "433"
},
{
"submission_id": "235626",
"mode": "Simple Stats",
"previewImage": "0c1b556c-bdb7-4287-b96b-aef1bcfd2295.png",
"modeId": "434"
}
]
// selectors
const gallery = document.getElementById('gallery');
const btnPrev = document.getElementById('btn-prev');
const btnNext = document.getElementById('btn-next');
// create gallery
function populateGallery(data) {
const numColumns = Math.ceil(data.length / 2);
gallery.style.gridTemplateColumns = `repeat(${numColumns}, 1fr)`;
// Sort data by REVERSE date
data.sort((a, b) => new Date(b.submitted) - new Date(a.submitted));
// create and add image blocks
data.forEach((item, index) => {
const link = document.createElement('a');
link.style.gridColumn = "span 1";
link.style.gridRow = (index % 3 === 0) ? "span 2" : "span 1";
const img = document.createElement('img');
img.src = `https://shismqklzntzxworibfn.supabase.co/storage/v1/object/public/previews/${item.previewImage}`;
img.alt = item.mode;
const title = document.createElement('p');
title.innerText = item.mode;
link.href = `https://icodethis.com/modes/design-to-code/${item.modeId}/submissions/${item.submission_id}`;
link.target = "_blank";
link.appendChild(img);
link.appendChild(title);
gallery.appendChild(link);
});
}
// gallery nav
function galleryControls() {
let counter = 0;
btnPrev.addEventListener('click', () => {
gallery.scrollBy({
left: -window.innerWidth,
behavior: 'smooth'
});
counter--;
btnState(counter)
});
btnNext.addEventListener('click', () => {
gallery.scrollBy({
left: window.innerWidth,
behavior: 'smooth'
});
counter++;
btnState(counter)
});
}
function btnState(counter){
btnPrev.disabled = counter>0 ? false : true;
}
populateGallery(SUBMISSIONS)
galleryControls();
Also see: Tab Triggers