Is there a way to set the modestbranding and color of a YouTube video element in Webflow, either through the UI or via custom code?

TL;DR
  • Replace the default YouTube element with a custom embed element in Webflow and use a YouTube URL with parameters like modestbranding=1 and color=white.
  • Drag an Embed Element to insert the customized URL with parameters, adjust settings as needed, then publish and test to ensure changes are applied.

To set the modestbranding and color of a YouTube video element in Webflow, some customization can be applied since direct options might not be available through the UI.

​

1. Use Custom Embed Code

  • Replace the default YouTube element with a custom embed element in your Webflow project.
  • In the embed code, add YouTube player parameters like modestbranding=1 and color=white.
  • A sample URL with parameters would be: 

  ```

  https://www.youtube.com/embed/YOURVIDEOID?modestbranding=1&color=white

  ```

​

2. Customize Embed Element

  • Drag and drop an Embed Element from the Webflow components panel.
  • In the embed code area, enter your customized YouTube embed URL and ensure all necessary parameters are appended.
  • Parameters to consider:
  • ?modestbranding=1: Removes the YouTube logo from the control bar.
  • &color=white: Changes the player control bar to a white color theme, where available.

​

3. Understand YouTube Parameters

  • Ensure all parameters are prefixed properly with ? for the first and & for subsequent parameters.
  • Adjust parameters based on what you need in your video customization.

​

4. Publish and Test Your Changes

  • Publish your site to view the changes in a live environment.
  • Test the embedded video to confirm that the desired branding and color settings are applied.

​

Summary

To customize the modestbranding and color of a YouTube video in Webflow, create a custom embed element with the necessary video URL parameters. This method provides more control over the video's appearance and branding settings.

Webflow Resources
Webflow templates
Webflow inspiration
Rate this answer

Other Webflow Questions

Explore Logic tutorials
What is the Webflow hosting CSS file and why is it large and causing a slow loading time?
What is the new feature announcement for Webflow regarding random dynamic list sorting?
How can I create a background scroll interaction effect using Webflow?
How can I make all of my visuals in a Webflow site, including looping videos and static images, scale responsively to window size changes while maintaining the 16:9 ratio and original margins between sections? I have tried inserting custom code into the head section, but it didn't work for me.
How can you access the content of a Webflow CMS website without rebuilding everything if the customer no longer wants to use the site as a CMS?
Can Webflow support the integration of "Instant Flipbook" software that requires uploading a folder with multiple sub-folders in one go or via an FTP client?
What are alternative solutions for setting DNS in Webflow if my provider does not support A Records or CNAME?
What is the correct format to pass an array of URLs to the Multi Image field in Webflow's API for updating?
How can Webflow users incorporate 3D objects and animations into their websites, interact with them using interactions, scrolling, and mouse movement, and import models and animations from Blender?
What are some third-party tools and integrations available for Webflow?
How can I make a Webflow gallery where hovering over a product enlarges it and clicking the product reveals more information, with the product remaining enlarged if it has been clicked?
How can I create a fixed navbar in Webflow that blurs the background behind it, similar to the effect in Safari's top bar?
How can I create a simple floating animation using images as floating objects in Webflow?
How can I resolve the issue with my pop up modals in Webflow's CMS Collection, where the modals are not displaying the correct information and closing one modal triggers others with the same class?
How can I resolve the issue of the wave animation in my Webflow project de-syncing when the page is loaded for the second time?
Can I capture a screenshot of a Webflow page on click and convert it to a downloadable PDF?
How can I alternate the layout of the image and heading for each collection item in a two-column format on Webflow?
How can I execute JavaScript code when clicking a specific button with a given ID in a Webflow project?
How can I disable the Webflow success or failure state for a sign-up form and display a custom thank you page using jQuery and the Webflow form submit state?
How can I create a vertical scrolling menu with Webflow, similar to the one on Apple's website, that switches to horizontal scrolling when the menu doesn't fit on one screen?
How can I change the language of the Google Maps embed from English to Arabic in Webflow?
How can I reduce the vertical space between lines within a bullet point in Webflow? Can I replace the bullet points with icons on the "Services" page?
How can the text color be changed for custom input fields on Webflow?
How can I add conditional visibility in Webflow to prevent a div from appearing on a published page if a CMS field is empty?
How can I stop a YouTube video from playing in the background in audio mode when I close a modal in Webflow?
How can I connect and use my JavaScript and CSS files for special functions and styles in Webflow?
How can I fix the "Ensure text remains visible during webfont load" warning in Webflow?
How can I implement a ThreeJS script as a background for my Webflow project using custom code?
How can I send data from a Webflow Form to ActiveCampaign without using Zapier? I have set the form to POST and input the form's action URL, similar to Mailchimp but it redirects me to the admin area of ActiveCampaign without sending the data. Has anyone had success with this method?
Can Webflow be used to create a "blob" elements effect in the header of a website using custom code or JavaScript?