Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form
When you visit a website that doesn’t exist or couldn't be found on the server because the webpage was moved or deleted, the broken link redirects to a 404 error page where a message indicating this error is shown.
You can customize your projects' 404 page and design it as you like.
A testing method that compares two different versions of a web page (a "control" and a variant) to identify which performs better.
The area where you manage your profile, subscriptions, billing info, and other account-specific settings.
Notifications that show you when others clone, like, follow, comment on, or interact with your public websites.
Time you spend in the Webflow Designer, actively making changes to your site.
Any element higher in the hierarchy.
Annual pricing gives you the ability to pay for a plan upfront at a discounted rate. Paying for a plan upfront can save up to 20% compared to paying monthly.
Third-party applications that you've given access to your personal and/or website data.
A section of the Style tab that contains CSS properties that affect an element's background, such as its background image, gradient, and fill color.
A saved version of your site that you can restore.
A meta tag that sets a default URL that all relative URLs in a document will follow. If you set your base tag to "your-site.com/beta," a relative URL of "/landing-page" will become "your-site.com/beta/landing-page."
A section of the Add panel that contains the elements that act as a website's basic building blocks.
A section of the Style tab that holds CSS properties for styling an element's border, such as its border style, color, and radius.
The grey bar at the bottom of the Webflow Designer that holds element breadcrumbs and the duplicate and delete functions.
Defines the spacing between the bottom border of an element and the elements below to it.
Defines the spacing between the bottom border of an element and the elements inside it.
Elements of Webflow site's HTML that include references to Webflow.
A Button is an element that links to pages, sections, external links, emails, assets, and telephone numbers.
The CMS Administrator is the only person who can invite and remove Content Editors. The Administrator is the person who holds the site in their Webflow account (usually the designer).
A dynamic page that Webflow automatically creates for each Collection item. When you design a Collection Page, all the pages that are created for each item will have the same template, but different content.
This site plan lets you publish a Webflow CMS–powered website to a custom domain. You need this plan in order to add Content Editors.
The CMS Settings tab is where the CMS Administrator can add and remove Content Editors.
The rules that define how a web page's elements are displayed in a browser.
A CSS property that defines visual effects like blur and saturation.
The space in the center of the Designer where your site's design and content display.
The order in which a Webflow site's CSS styles flow from desktop to mobile media queries.
A form element that lets people select one or more options.
An element directly below the current element in the hierarchy.
A selector type that affects all elements with that class.
Cloneable projects are open source (made available under the CC0 license). You allow any user to copy, modify, and use any part of this project for personal or commercial purposes.
Projects with cloning turned off do not give others access to copy your project or open it in the Designer.
A collaborator is someone who has been invited by the site admin (typically the designer) to make content changes on a CMS-powered website.
A Collection is a content type (blog post, portfolio item, etc.) represented by a group of fields you define. Once created, you can add individual Collection Items.
A Collection Field is an individual field within a Collection. You'll select which fields to display in Dynamic Lists and Collection Template Pages.
A Collection Item is an individual item within a Collection. For example, in a Blog Posts Collection, the Collection Items are individual blog posts.
A Collection List, formerly Dynamic List, is a Webflow element that lets you display content from a CMS Collection.
The Collection List Layout lets you control how Collection Items display inside a Collection List. The default layout option has each item covering the full width of the parent element. You can change this to display items in 2, 3, 4, or 6 columns.
The Collection URL is the slug that represents the parent folder for your individual Collection Item URLs. For example, if you created a Collection called Blog Posts, the URL would be website.com/blog-posts, while a Collection Item URL would be website.com/blog-posts/hello-world.
By default, Collection List display all items in a Collection, but you can add limits to control the number of Collection Items that display.
The Color field is a CMS field used in Collections. Add the Color field to a Collection to let collaborators use a color picker to style elements like background color, text, and border color within the CMS Panel.
Columns let you create sections of content that sit side by side on your website, like the columns in newspapers. You can choose how many columns you want and their widths. You can also control how they display on smaller screens — such as stacking them.
Combining two or more classes into a single selector to target an element.
All elements on the page targeted by the same selector.
A section in the Add Panel that houses pre-built Webflow elements such as sliders, tabs, and lightboxes.
An element that contains content.
Content first is a design approach that prioritizes content planning and production in the design process.
A Webflow service that lets you point a custom domain to your Webflow hosted site.
DNS (Domain Name System) records tell the DNS server where each domain should point to. There are a number of different DNS record types, example MX records which point emails (firstname.lastname@example.org) to the email host.
To point your domain to Webflow, you'll create 2 types of records: A records to point the root domain (domain.com) to Webflow and a CNAME record for each subdomain (blog.domain.com, help.domain.com) as well as the full domain (www.domain.com).
The Webflow records should point to the following addresses or values:
If SSL is ON (recommended) in your Webflow settings, the Webflow A record values should be: 22.214.171.124 & 126.96.36.199 and the Webflow CNAME record values should be: proxy-ssl.webflow.com.
If SSL is OFF (not recommended) in your Webflow settings, the Webflow A record value should be: 188.8.131.52 & 184.108.40.206 and the Webflow CNAME record values should be: proxy.webflow.com.
To connect your domain to Webflow, check out the Connecting a custom domain tutorial.
The Date/Time field is a CMS field used in Collections. This lets you and your Content Editor(s) display a date and time in a Collection and/or Collection Item.
To remove an element and its content from your website.
Any element lower in the hierarchy.
An area of the Webflow site containing profiles of designers who use Webflow. It offers a safe, secure way for clients to reach out to web designers who use Webflow.
A Webflow Canvas setting for creating styles that affect viewports with a minimum width of 991px.
A fun, easy way to see websites people built with Webflow.
A CSS property that specifies an element's box type. It determines how an element displays — or, is laid out — in a design. Options include block, inline-block, inline, flex, grid, and none.
Block elements start on a new line and take up the full available width.
Grid containers arrange their children (items inside them) across multiple columns and rows.
You can customize how the direct children are positioned, aligned, and distributed within the grid components: the container, the individual cells, group of cells, or tracks.
The grid child settings allow you to override the grid container settings for alignment and justification. They also allow you to change the order of the selected grid children. Learn more.
Inline elements stack horizontally where vertical spacing is based on line-height, not margin or padding. They only take up the space their contents require. Width and height can't be applied.
Inline-block elements stack horizontally on a line and do accept width, height, padding, and margin settings.
The display value that treats an element as if it doesn't exist while still keeping it (hidden) in the HTML document.
Since elements with a display:none property do not display in the design, this can be handy for altering how content displays on mobile devices. Learn more.
Flex containers arrange their children (items inside them) horizontally or vertically. You can customize how the direct children stack, when they wrap, how they are aligned and justified within the flex container.
The flex child settings allow you to override the flex container settings for alignment and justification. They also allow you to change the sizing and order of the selected flex child. Learn more.
An element that is used when no other element is specifically suitable.
The document object model is a platform- and language-neutral interface that lets programs and scripts dynamically access and update the content, structure and style of documents.
You can exclude pages from being published to your site by setting them as drafts. These can be unfinished pages, internal pages such as style guides, archived pages saved for backup, etc. Learn more about drafted pages.
A Webflow component that lets you display a menu that expands to show a list of items when clicked.
To copy an element and its content, styles, and settings.
Dynamic elements are elements inside a Collection List or Collection Page that can use dynamic content. You will know when an element can use dynamic content when the Collection Style Settings are visible in the Settings tab of the Settings panel.
Dynamic content is content you create once, but publish in many different places across your website. As you update this content, it will automatically update wherever it exists, making it really easy to create—and manage—larger websites.
The area of Webflow CMS that appears at the bottom of the live site, and that Content Editors can use to manage Collections and create new Collection Items (pages, blog posts, etc.).
A section in the Style Tab that houses CSS properties for changing how an element appears such as its opacity, size, and rotation.
A navigational aid that displays in the bottom of the Webflow Designer to help you keep track of the element you're interacting with in relation to its hierarchy.
The color-coded borders of elements you'll see in the Webflow Designer.
An area of the Froms tab in your Site Settings that lets you customize your Webflow form submission notifications.
A Webflow component you can use to embed HTML to display external content, plugins, or applications.
The <em> element defines emphasized text with added semantic importance.
Elements that don't contain any other elements. They're outlined by a dashed gray border.
A Collection displays its empty state when it contains no Items, giving you the opportunity to design for a situation where there's no content to display. Check out the Empty States blog for inspiration.
A downloadable ZIP file that contains your Webflow site's HTML, CSS, JS, and image files.
A Webflow component that embeds a Facebook Like button in your site.
A 16x16 px image that displays in browser tabs, bookmarks, and other browser areas. It's typically a simplified version of the site's logo, or "bug."
A form element that looks and behaves like normal text but generates form-specific code on export. It tells website visitors what content to enter into the associated field.
An element contained within a parent element that has display: flex set.
A flexbox property that lets you customize the alignment behavior of flex children, based on the cross-axis of the flex container. The cross axis is the opposite of the flex-direction property, so if you set the direction to vertical, the cross axis is horizontal. Options include start, center, end, baseline, and stretch.
A flexbox property that determines the flow of flex children: horizontal or vertical.
A CSS layout module in which you control the layout of a parent container's children using alignment and distribution tools similar to those in most graphic design programs. Children can flow either horizontally or vertically and can wrap to new lines, as well as be reversed.
A subdirectory of your site's root folder used for organizing web pages. Learn more about Page folders.
The folder settings tool allows you to manage your folders. Learn more about Page folders.
Custom code you can add just before the closing tag in your site's HTML file.
A set of elements that make up a basic form.
A form element that lets website visitors submit data to your form handler.
When someone sends data through one of your site's forms.
A section of the Add panel that houses form elements like inputs, checkboxes, and radio buttons.
A unique ID you can use to link your Google Analytics account to your Webflow site.
A Webflow component that embeds an interactive Google Map in your site.
A unique string of numbers and characters that helps you verify the ownership of your Webflow site with Google.
A Webflow component that embeds a Google+ button in your site.
Custom code that's added just before the closing tag in your site's HTML file.
A typographic element that describes the topic of a section it introduces.
Defines how tall an element can be. This can be defined in absolute terms (pixels) or relative terms (ems, rems, percentages, viewport-height, or viewport-width).
The way browsers calculate an element's height automatically, so that block-level elements fill the available space of their parent containers and inline elements shrink to the size of its children/content.
The place to go when you need help using Webflow.
Help text lets you explain what content should go in a given Collection field. This only appears in the CMS, not the public site.
The page people see when they visit your site's root domain. Read more about the homepage.
A standard markup language that web browsers use to display websites.
The <a> tag defines a hyperlink, which is used to link from one page to another. this
You can assign elements IDs from the Settings Tab in the Right Side Panel of the Designer. ID selectors are useful for html anchors, linking to page sections, or for custom code.
A Webflow element that displays graphical files on your website.
The Image field is a CMS field used in Collections. With this field, you and your Content Editors can upload images from your computer and use them as a dynamic item for your individual Collection Item.
A form element that lets website visitors enter single-line data.
The default UI state for your Collections. The opposite of an empty state, it displays the items in the Collection.
A set of keyboard commands you can use to quickly navigate and make changes in the Designer. Here's the full list of Webflow keyboard shortcuts.
A unique code you can add to your Webflow site to let browsers, translation apps, and other tools perform language-sensitive tasks.
The last time your site was published.
The last time someone made a change to your site.
A section of the Add panel that houses elements you'll use to "lay out" the scaffolding of a Webflow site.
Defines the external spacing between the left border of an element and surrounding elements.
Defines the spacing between the left border of an element and any elements it contains.
The vertical bar of tools on the left side of the Webflow Designer. It holds the Add panel, Pages & Folders panel, and view tools.
A Webflow component that opens a full-screen view of images or videos when clicked.
An element you can use to link images or text to other pages or sections of a webpage.
The Link field is a CMS field used in Collections to link to another page (or area of a page, for anchor links) on the web.
A secondary selector that overrides an element's existing styles.
A dropdown menu that displays all the selectors that affect a given element.
An element that contains ordered (numbered) or unordered (bulleted) lists.
An element that can only be added to a list element that houses content displayed in a list format.
Defines the external spacing between an element's border and the elements around it.
Defines the maximum height of an element. This can be defined in absolute terms (pixels) or relative terms (ems, rems, percentages, viewport-height, or viewport-width).
Max width defines the maximum width of an element. This can be defined in absolute terms (pixels) or relative terms (ems, rems, percentages, viewport-height, or viewport-width).
A section of the Add Panel that holds multimedia elements like images and video.
A CSS feature that allows you to adapt your site's styles to different screen/device widths (the basis of responsive web design).
An HTML attribute you can use to give a short description of the contents of a webpage. Search engines often display this in results pages (SERPs).
Words or phrases you can include in your web page's metadata. Once used to indicate a page's topic(s), these are now ignored by most search engines.
An HTML element that defines a page's title. Search engines usually display this in search results pages (SERPs).
Minifying your site's code can help your live website load faster, but makes your code a little harder to read. It can also fix spacing issues with inline-block elements.
You can minify CSS, HTML, and/or JS separately in project settings → hosting → advanced publishing options.
A method of lowering the file size of your stylesheet(s) by removing all white space from your CSS files.
Defines the minimum height of an element. This can be defined in absolute terms (pixels) or relative terms (ems, rems, percentages, viewport-height, or viewport-width).
Min width defines the minimum width of an element. This can be defined in absolute terms (pixels) or relative terms (ems, rems, percentages, viewport-height, or viewport-width).
A Webflow Canvas setting that lets you create styles for viewports with a minimum width of 480px and a maximum width of 767px.
A Webflow Canvas setting that lets you create styles for viewports with a minimum width of 240px and a maximum width of 479px.
The Multi-Reference field is a CMS field used in Collections. Just like a Single Reference Link, the Multiple Reference Link lets you reference other Collections on your site. But it’s even more powerful, as it lets you reference multiple items within a Collection instead of just one.
A Webflow component that automatically creates a responsive navigation menu for desktop and mobile.
The middle tab of the panel on the right of your screen in the Webflow Designer that lets you manage your site's hierarchy tree.
The place to go when you need help with your site's design, custom code, etc. Get help.
The Number field is a CMS field used in content Collections. The Number field lets you insert an integer with or without decimals. Just like the plain text field, it also allows you to limit your Content Editors from adding styles or other inline media.
Defines the inside spacing between an element's border and the elements inside it.
The title used to describe a page in your site in the Pages panel.
The page settings tool allows you to manage your pages. Among the many functions in the Page settings panel, you can rename, duplicate, delete, or save pages as draft. You can also set SEO & OG settings and search settings. For Collection pages, you can also set RSS settings. Here, you can also insert custom code that you want to apply for this whole, page either inside the <head> tag, or before the closing </body> tag.
This checkbox allows you to enable or disable pagination on the selected collection list. Disabling and re-enabling pagination will restore previous settings and component styles.
Through the pagination settings, you can preview collection list pages by choosing the page number from the page dropdown list, or you can switch to the previous or next page using the arrow keys.
A typography element that is used for displaying multi-sentence text content of a web page.
The element directly above in the hierarchy tree.
The folder or the subdirectory in which a page or another folder lives. Learn more about page folders.
You can keep a page private by setting a custom password that will be required to view this page. You can also keep all pages within a folder private by setting a password in the folder settings. Learn how to set a page or folder password.
A measurement unit relative to an element's parent.
The Webflow subscription designed for the growing web designer.
The smallest controllable element of a picture represented on a screen.
The Plain Text field is a CMS field used in content Collections. Best used for for basic text content that doesn't need special formatting like headings, inline styles, or inline media like images or video.
A section in the Style Tab that houses CSS properties related to the positioning of an element such as Margin, Padding, and Float.
A feature that allows you to see how your site would be displayed in the browser without needing to Publish or leave the Designer.
The Webflow subscription designed for freelancers and web pros.
A project is a website that you build in Webflow. You can publish projects to a webflow.io staging subdomain for free, export the code on a paid plan, or add hosting on any plan to connect your custom domain and unlock hosting features.
A Webflow project that is publicly visible in your Webflow Profile.
The Webflow public profile allows you to showcase some of your projects with the world.
The specific domain or subdomain you wish to have your Webflow site displayed.
The act of updating your live site to reflect changes made while using the Designer.
A form element that allows you to select one of a limited number of choices.
A way to allow others to test/debug your Webflow site from inside the Designer without having the ability to save changes.
You can receive emails confirmations when making Webflow payments.
To move forward one step while making changes to a Webflow site.
The Reference field is a CMS field used in content Collections. This powerful field allows you to link to other collections within your website to populate fields in Dynamic Lists and Collection Template Pages.
You can give and receive credits that can be applied to your Webflow subscription using your uniqe referral link.
You can set any Collection Field as "Required," forcing content editors to enter some value before they can publish the item. The only Collection Field that cannot be made required is the Switch Field.
The rich text element allows you to create and format headings, paragraphs, blockquotes, images, and video all in one place instead of having to add and format them individually.
The Rich Text field is a CMS field used in content Collections. Use Rich Text for long-form content or areas of the website where you and your collaborators might need multiple paragraphs, headings, or inline media such as videos, images or links. Rich text also allows CMS Editors to add further text formatting such as bold, italics and underline.
Defines the outside spacing between the right border of an element and the elements next to it.
Defines the inside spacing between the right border of an element and the elements inside it.
The far right vertical panel of tabs that houses features such as the Navigator, Style Manager, and Asset Manager.
A file that gives web robots instructions on which pages you want them to crawl/ignore on your site. This can be useful for preventing duplicate content from being indexed in search engines, but not a good way to hide information.
Mid-September 2019, new European requirements for authenticating online payments were introduced in Europe as part of the second Payment Services Directive (PSD2) [↗]. The Strong Customer Authentication (SCA) [↗] requirements apply to businesses in the European Economic Area (EEA) [↗] that accept online card payments from cardholders whose banks are also located in the EEA.
Webflow Ecommerce payments are PSD2 and SCA compliant (i.e., support 3D Secure payments) for European customers.
SSL ("secure socket layer") is the standard method for establishing an encrypted link between a web server and a browser. It ensures that all data passed between the web server and browsers remain private and integral, so you and your website's visitors can rest assured that your information is safe.
Sites that don't use SSL may be labeled "not secure" by some browsers, strongly discouraging people from visiting your site.
An option that allows you to serve your images over your own CDN service while using SSL.
The Designer automatically saves your progress every 10 seconds.
The ability to manually save a Version of your site that you can restore at a later date using the keyboard shortcut Cmd+Shift+S (or Ctrl+Shift+S on Windows).
An element that is used to house large separate "sections" of content in a Webflow site.
A form element that allows you to make a selection in a drop down list.
A name you assign an element in order to style it.
A psuedo class that allows you to change the styles of an element when it is hovered, pressed, or focused.
The second tab in the Right Side Panel that allows you to change element specific settings such as the HTML tag, input types, and custom attributes.
A section in the Style Tab that houses CSS properties for styling both an element's Box Shadow as well as Text Shadows.
The Webflow showcase features all Webflow projects showcased by individuals and teams.
An element that shares the same parent of another element.
The location your sitemap is stored in relation to your site and is used when submitting your sitemap to search engines.
A file that gives web robots information on how a website is organized and allows search engines to find your site data faster and more efficiently. This can be useful for helping a search engine organize your site links when displayed in search results.
A Webflow component that houses slides of content that are displayed when interacting with a slider navigation or timer.
The end part of a URL that uses human-readable words that generally match the web page's title.
Note: Changing the slug of a page will change the final URL of the page once it is published. We recommend that you redirect the old URL to the new location. Read about 301 Redirects.
A saved version of your site that is created every 20th auto-save or any time you press Cmd+Shift+S (or Ctrl+Shift+S on Windows).
Sorting allows you to sort your items in multiple ways - simply select the field from the collection you wish to filter from, then select the ordering option that populates below it.
The <span> tag is used to style inline-text.
The dropdown menu to the right of the selector field that allows you to access and change the styles of a class when it is hovered, pressed, or focused.
Static Content is content that is not binded to any Collections or dynamic elements.
A document that makes up an individual web page on your site — designed visually in Webflow and rendered in HTML to be displayed in a web browser. Static pages are pages you can create manually as opposed to Collection pages and Utility pages.
Webflow limits the number of static pages and collection pages on the Free Starter plan. The page limit for premium plans and Team plans or Webflow hosted sites is 100 static pages. The limit exists to ensure optimal Designer performance.
You can try using CMS Collections pages for pages that use the same template and structure. This allows you to have up to 50 dynamic pages on a free Starter account. On a Webflow-hosted site, you can get up to 10,000 dynamic pages based on your site plan. See all site plans and their features.
The <strong> element defines important text with added semantic importance.
The first tab in the Right Side Panel that allows you to assign classes to elements and style them.
The first tab in the Right Side Panel that allows you to assign classes to elements and style them.
The part of a domain that comes before the root domain. e.g. blog.your-site.com is a subdomain whereas your-site.com is the root domain.
When a search engine crawls your site's Webflow subdomain (e.g. your-site.webflow.io).
The Switch field is a CMS field used in content Collections. This field offers you a powerful filtering tool. For example, you could create a field labeled "Featured?" for Blog Posts, so you or your content editor could showcase particular posts.
A Webflow Canvas setting for creating Styles that affect viewports with a minimum width of 768px and a maximum width of 990px.
A Webflow component that displays a pane of content associated with a tab menu button.
The currently selected element.
You can set up an organization in Webflow designed for multiple team members to work from a separate dashboard.
Organizations with a Team Plan subscription can create templates to quickly build sites with similar layouts. Learn more.
A form element that allows you to enter multi-line data.
A Typography element that is used when no other element is specifically suitable.
A Typography element that is used to link to other pages or sections of a webpage.
Defines the outside spacing between the top border of an element and the elements above it.
Defines the inside spacing between the top border of an element and the elements inside it.
The total weight of your site's HTML, CSS, JS, and images.
The amount of times a site visitor submits data using your site's form(s).
The amount of pages your site currently has.
You can transfer sites you make in Webflow to another person's Webflow account.
The fastest way to learn how to use Webflow to build responsive websites.
A Webflow component that embeds a Twitter Follow or Share button into your site.
A set of Adobe fonts that can be used with your Webflow site.
The API token (similar to a password) that Webflow uses to connect to your Adobe Typekit account.
A section in the Add Panel that houses typography elements such as headings and paragraphs.
A section in the Style Tab that houses CSS properties related to how typography is displayed such as Font Family, Line Height, and Text Align.
The UI State is in reference to how Collections are displayed on your website. Items State is the defaulted option, and will show the items that you have within the Collection, whereas the Empty State will not show these items and give the designer the opportunity to design for a circumstance if/when there is no data to be displayed for this list.
A way to forward a previously used URL to a different URL without losing SEO placement.
Form submission notifications that have no visual reference to Webflow. (sent from "email@example.com" instead of "firstname.lastname@example.org")
To move backward one step while making changes to a Webflow site.
An Unpublished Change is a change that has been made in the Webflow CMS, but will not appear on the live website until the site it is next published. You can track any unpublished changed on the bottom right of the CMS Panel.
The ID used to log into your Webflow account (also displayed on your public profile)
Utility pages are default templates for your site’s 404 page, password page, and search result page. You can customize these pages to look the way you want.
A Webflow element that displays externally hosted videos such as Youtube and Vimeo.
The Video field is a CMS field used in content Collections. You can add videos via a link—not an embed code—from an online video host like Vimeo or YouTube. Just paste in the video link and it’ll appear in the native video format from the 3rd-party video player.
A section in the bottom of the Left Toolbar that houses features of the Designer that are designed to help you visibly see elements of your web page.
The virtual "window" used to display websites and apps.
A 256x256 px image that is associated with your website that is displayed on iOS devices and in Safari bookmarks.
A visible "Made in Webflow" badge displayed in the bottom right corner of Webflow sites on Free plans.
Webflow's visual content management system. You can access it through the Webflow Dashboard by clicking the CMS button in site settings. Your invited Content Editors can access it anywhere on their live site by adding ?edit after the page URL. E.g. yoursite.com/page/?edit.
The title used to describe your website throughout Webflow.
Width defines how wide an element can be. This can be defined in absolute terms (pixels) or relative terms (ems, rems, percentages, viewport-height, or viewport-width).
The way browsers calculate an element's width automatically where Block level elements fill the available space of its parent and Inline elements shrink to the size of its children/content.
A grayscale view of your site's canvas that visually displays each element's border, margin, and padding when hovered over.
A web app that helps you connect multiple third-party services together based on triggers and actions.