Intro

Want to become a Webflow template designer? The Webflow platform is a great place for template designers to get exposure and make money! We’d be happy to have you on board. Read on to learn about how to join.

Submission process

Step 1 - Send your portfolio for review

If this is your first time submitting a Webflow template, send us a link to your portfolio and/or other websites you've designed before sending us a template. We want to make sure your past work demonstrates quality design, layout, and content structure. Please send us your portfolio for review to templates@webflow.com.

Step 2 - Send us your template idea for review

So you want to build a template? First send your template idea to templates@webflow.com for approval. Include the primary tag, the CMS collections you will be including, and a list of pages you want to include. Check out the highly-requested templates from our Missing Templates list. We review the general idea and content strategy of the template to make sure it would generate enough sales.

Step 3 - Send us a design for review

Send your template design to templates@webflow.com for approval. This can be a mockup or an already-built Webflow site — whatever would help us see the visual design of the template.

Step 4 - Send us your template

Once you've built your site in Webflow, send the site URL and preview link to templates@webflow.com for review. At this stage we do a general review of the design, usability, and content of the site. Before sending the template make sure it follows the Template Checklist to avoid several rounds of review. In other words — test every component on every page on every device.

Step 5 - Send us your template graphics

Once your template has been approved, you'll need to email the template info and graphics. Your template reviewer will provide a link with instructions.

Templates you should build

Templates with 0 search results

These templates don't yet exist in the marketplace so searches have 0 results. The list is sorted by search volume.

  • Landing page template
  • Marketplace template
  • Software CMS template
  • Real Estate CMS template
  • Construction CMS template
  • Directory CMS template
  • Movie/Film CMS template
  • Admin/Dashboard template
  • Ebook CMS template
  • Product template
  • Yoga CMS template
  • Video Production CMS template
  • Job portal CMS template
  • Help Documentation template

We provide monthly search analytics for approved template designers so they can decide how to prioritize their template development.

Templates with high sales but few results

There are only 1 or 2 of these templates in the marketplace but they have high sales.

  • Hotel CMS template
  • Church CMS template
  • University/School CMS template
  • Business CMS template (collections: blog posts, jobs, features, help documents, team members, landing pages)
  • Conference CMS template
  • Health CMS template
  • Architecture CMS template
  • UI Kit template
  • Attorney/Legal/Law-firm CMS template
  • Non-profit CMS template

Template Support

Template designers are responsible for providing support to their customers. Each template page has a "Support" tab where customers can ask questions. These comments are visible to the public. Designers get notifications when comments are added and are required to respond within two business days.

Support questions related to Webflow bugs and features should be directed to Webflow support (support@webflow.com).

Template License

Premium templates will be sold under the Single-Use License. Designers must agree to the Designer Agreement.

Free template submissions are not accepted. Add clone-able websites to your public profile if you'd like to share free resources with the community.

Commission Structure

80% Payout

  • Earn 80% of total template sales
  • Must add at least 1 new template in a 30 day window to stay in this payout tier

60% Payout

  • Earn 60% of total template sales
  • No minimum 30-day template requirements

Notes

  • Templates submitted for review (Step 4 in the submission process) may count as a template in the month’s 30-day window, but the template must be complete and the design must be approved. For example, if Natalie submits a completed template on the second-to-last day of March, and the design is approved then the 80% commission will be honored for her March template sales.
  • Template designers must create a template from the suggested template category list or any template approved by the Webflow team.
  • Payments are processed at the end of each calendar month, and are paid out on the 15th of the following month via PayPal. Ex: You will be paid on May 15th for April's template sales. You must be able to receive money from Paypal to sell templates on the Marketplace.
  • Webflow occasionally runs promotions that include discounts on templates. Your commission on templates purchased with such a discount will be calculated from the discounted price.

Template Checklist

Overview

The template must meet all of these requirements to be added to the Webflow Marketplace. Go through this checklist before sending your template for the first review.

Choose a Primary Tag

Pick a primary tag below that best fit your template. This will be the main way we describe your template throughout the template marketplace. Ex: Choose "Cafe" if it's a template for cafe businesses.

  • Business Tags:
    Business, Corporate, Startup, Dentist, Real Estate, Marketing, Hotel, Magazine, Newspaper, Fashion, Directory, Law, Consulting
  • Portfolio Tags:
    Portfolio, Creative, Designer, Photography
  • Entertainment Tags:
    Entertainment, Band, Musician, Travel, Restaurant, Cafe, Bar
  • Personal Tags:
    Personal, Resume, Author
  • Blog Tags:
    Blog, Magazine, Newspaper
  • Event Tags:
    Event, Wedding, Conference
  • Nonprofit Tags:
    Nonprofit, Church, Political, Charity, Education, Religion
  • Other Tags:
    Other, Mobile, Landing Page, Coming Soon, Under Construction, Countdown, Contact Form, Error, App, Multipurpose, Wireframe, Product, UI Kit

Layout variations

Many of today's templates offer multiple layout variations for home pages, contact pages, etc. Designers can add layout variations to their template but should follow these guidelines:

  • The entire template should have a cohesive style.
  • Content and design should fit within a set of related tags. In other words you should not target multiple verticals for one template. 
  • Good example: A business template with 5 different homepage variations, 5 different pricing page variations, and miscellaneous pages that fit the "business" vertical (like landing page, jobs page, etc). 
  • Bad example: A business template with a different homepage variation for a business, one for a phone app, one for an agency, one for a restaurant, and one for a portfolio. These are all different verticals.

Templates with a large number of layout variations are tagged with "UI Kit". 

Content

  • Very important: designers should create content and layouts that fit that template’s primary tag. For example: a Nonprofit template should have content, layout and database structure that is best suited for a nonprofit website. Do some research to find out what kind of content that type of website usually has.
  • Avoid using generic content patterns. Ex: Progress bars for professional skills

CMS Structure

  • Collections should match the type of content that would normally exist in that category of a website. Ex: a Band website may have a collection of Songs, Albums, Shows, and Photos.
  • Collection Fields should match the type of content that would normally exist in that category of a website. Example: the Shows collection in a Band website may have the Name of the show, a venue name, a venue location, a date, and a link to purchase tickets or a link for more info.
  • Collection slugs should be singular. Ex: website.com/article/page
  • Collection fields should be in a logical order with well-written help text on how to use them.
  • Collections should have at least 3 items and a maximum of 7 items per a collection. These items should have dummy content that makes sense for that category of a website.

CMS Design

  • Conditional visibility should be added to items that are dependent on if a field value exists or not. Ex: only show Facebook link under a team member if the Facebook link field has a value.
  • Dynamic lists that are grids should be tested with long item names to make sure the layout doesn't break.

Tags

  • All tags on the site (All Paragraphs, All Ordered Lists, All H1 Headings, etc) should be styled so they create consistent and readable body copy whenever a Rich Text Element, Heading element, or any other text element is added to a page. Here are all Tags that should be styled:
  • All Headings tags (H1 Headings, H2 Headings, etc)
  • All Paragraphs tag
  • All Unordered (bulleted) lists tag
  • All Ordered (numbered) lists tag
  • All Blockquotes tag
  • All Figures tag (image and caption wrapper)
  • All Figure Captions tag (image caption) 
  • All Links tag 
  • Special Headings, paragraphs or other text elements that look different than the default Tags defined above should have a class with those override styles. Ex: If a section heading looks different than the All H2 Headings tag then create a new class for that section heading.

Rich Text 

  • Rich Text elements should have every text type showcased when used in the template detail page. Example: Evermore Template blog page.
  • As mentioned in Tags section above, when a user adds any text element inside of a Rich Text, it should look good and be styled correctly in the Tag selectors.
  • If there is special styling on elements inside of a specific Rich Text element, add a class to that Rich Text and then style tags for that class. Ex: If a text link is supposed to look different in a specific Rich Text compared to All Links on the site.
  • Spacing between each text element inside of a Rich Text should be consistent. Ideally this spacing should be set on Tags so they're consistent throughout the site.

Conditional Visibility

  • Elements on the site that depend on certain fields in a Collection to be filled out should be have conditional visibility enabled. Ex: Individual social links under team members should be hidden if the team members are a collection and a field is missing a link.

Typography - Legibility, spelling, and grammar

  • All text should have proper spelling and grammar
  • Headings need unique wording (not "lorem ipsum) for the type of website it is made for.
  • Paragraphs can use “lorem ipsum”
  • Text needs to be legible (background and font colors should have enough contrast on all device screens)
  • Long and short heading titles should be used to test line height bugs
  • Text line-height should avoid text crashing on itself on all devices
  • Set the primary font on the Body element. Secondary fonts, like for Headings, should then be be set on individual tags, and then on individual classes.

Logo

  • The logo in the navigation should have same name as the template. The logo should be an image so it’s easy to replace.

SEO

  • Use H1 heading elements once on the page for the most important heading. It has the highest ranking. Note: You can use multiple H1's if nested inside of section or article tags.
  • Use H2-H6 subheading elements in a correct hierarchy on the page. These subheading elements rank in importance according to the number in their name, so assign correct subheadings for importance of content.
  • SEO settings need to match the template name on the home page settings. SEO Title should read "{Template Name} - Webflow HTML website template".
  • Include "Powered by Webflow" in the footer and link to Webflow's homepage.

Layout

  • Website layout should follow consistent spacing and not appear crammed or cluttered
  • The main structure of the site should use sections, containers, and columns when possible.
  • Sections should have a min-height instead of a height so that it can grow when there’s more content added. This problem is usually found in hero sections.
  • Website should not have any horizontal scrolling

Responsive Behavior

  • Important: Layouts should be fluid and percentage based for the most part. Designer should test their layouts by dragging the viewport width in Webflow and test the published site on mobile devices.
  • Components should work across all media queries. Ex: tabs should become stacked on mobile
  • Generally layout spacing should be tighter on mobile devices.

Webflow Usability

  • When possible use initial appearance on elements with Interactions so that it’s visible to customers. Detail: Some elements use display:none, visibility:hidden, or opacity:0 and other elements are visible by default and have display:none set on an Initial Appearance. 
  • Components (tabs, sliders, etc) should not be nested. Ex: slider inside of a slider.
  • Links and buttons need hover states to show that they are clickable.
  • Elements that aren't clickable/interactive should not have hover states.
  • All links/button should link somewhere. No empty links. 
  • The main images inside repeating grid items should be links instead of just having small hidden text links
  • Maps should not have scroll to zoom enabled.

Forms

  • Form fields should have correct settings. Ex: email fields should not be text fields
  • Success messages should be customized to fit website design
  • Input focus states should be customized to fit website design
  • Input fields text and placeholders should be legible
  • Give appropriate names to the Forms and Field elements (in form settings). These names will appear in form email notifications and form reports.

Symbols

  • Symbols should be used for navigation, footers and repeating sections.
  • Symbols should not be nested.

Classes and Styles

  • When possible don't create new classes and styles when you could re-use or cascade styles from another class to create the same design.
  • Combo classes should be carefully used and not more than two levels deep.
  • Class names should describe the element. Bad: "column2", "text1" or “section-6”. Good: "Social Icon" or "Author Title" or “Testimonial Section.”
  • Unused styles should be cleared.
  • Delete styles if they aren’t needed. Ex: Setting float: none has no purpose unless you are overriding float: left.

Transitions

  • Transitions should be applied to specific properties, not “All”.
  • Transitions should be set on all properties that change on hover. E.g. If text color changes on a button hover it should have a transition.
  • Transitions should be consistent. Ex: input focus and button hover transitions should have same timing.

Naming Conventions

  • Classes should be Title Case and not abbreviated. Do not use dashes or other traditional css conventions (e.g. camelCase). Class names should follow correct spelling.
  • Page names should be Title Case and should be consistent with navigation link names for those pages.
  • Symbols should follow Title Case
  • Interactions should follow Sentence case and be descriptive e.g. use "Slide nav down on scroll" instead of "Show nav"
  • Collection names should be Title Case and should have the Singular and Plural versions defined correctly. This sentence should sound natural: “This is a collection of {{plural-version}}” and “Create a new {{singular-version}}”
  • Collection slugs should be one word and singular tense. They should also describe what the collection item is. Ex: article, project, member, author, client, tag, category, event, location, property, etc.
  • Field names should be Sentence case and should have correct spelling
  • Collection item names should be Sentence case.

Images

  • Images, icons and other assets used in the template should be allowed for resale by the copyright holder. We will ask about the licenses of the assets used in the template.
  • Large background images should be less than 300kb and small assets should be less than 20kb.
  • Images should be crisp on retina devices and cropped nicely
  • All images should be sharp (@2x) on retina devices.

Licensed images

  • Use CC0-licensed images when possible. Use services like: sitebuilderreport.com/stock-up or pexels.com or unsplash.com
  • Images without a CC0 license should have a Webflow watermark on the image. Ex: -----
  • Images without a CC0 license need to be listed on a page titled “Image Licenses" and with the slug “/licenses”. Ex: template-seaside.webflow.io/template-information/licensing
  • Add this text at the top of the Licenses page: “All the images in this template can be used for personal or commercial use except for the images listed below, which have only been used for demonstration purposes. If you wish to purchase a licensed image for commercial purposes, please follow the link provided next to the image.”
  • The license page should have <meta name=""robots"" content=""noindex"" /> in page’s custom head code

Pages

  • Pages should have unique layouts (designers should avoid redundant page designs with little structural differences).
  • Dynamic collection page templates should have appropriate fields added to the SEO and OG fields.

Site Settings

  • Favicon and webclip should be custom and match the template's theme.
  • The site's total weight should be less than 10mb.
  • Only Google fonts can be used - no Typekit or custom fonts.

Custom Code

  • Custom code (in site settings, in embeds, in page settings) is not allowed in Templates.

Test, Test, Test

  • Test every link/component/interaction on every page and on every device so that there are no design or layout bugs.  

Recommended practices

  • Create a page called “Style Guide” with all of the tags (Headings, paragraphs, text links, lists, buttons, etc) 
  • Create a page called “Instructions” if advanced and hard-to-use interactions or hidden components are used in the site. This page should provide brief information on how to access and edit these components.

Designer Agreement

Overview

Template designers agree to these points when adding their template to the Webflow Marketplace:

  • Webflow templates are exclusive for the Webflow Marketplace. Template designers must not resell the same template on any other marketplace or service.
  • If a template has any bugs we will remove the template from the Webflow Marketplace until the bugs are fixed by the template designer.
  • Templates must be updated with the latest Webflow features.
  • Template designers can advertise their templates on their personal website or on other channel, but it has to link to the template detail page on the Webflow Marketplace.
  • Poor-performing (less than 5 sales a month) or outdated templates will be removed from the Webflow Marketplace.
  • If improperly-licensed images/assets are found in a template, all of the designer’s templates will be unpublished and reviewed for infringement.
  • The template commission structure is experimental and may change
  • Template designers retain the rights to the template they sell on the Webflow Marketplace. They transfer these rights to the template customer as part of the Single Use License.
© 2017, Webflow, Inc. All Rights Reserved.