Chapter 277: Flickering when using background-image or mask-image

Core Idea

The following code is discouraged in Remotion:

Key Concepts

• Problem
• Solution
• Workaround
• See also

Code Examples

const src = "abc";
const myMarkup = (
  <div
    style={{
      backgroundImage: `url(${src})`,
    }}
  >
    <p>Hello World</p>
  </div>
);

• What it demonstrates: Usage pattern for Flickering when using background-image or mask-image from the official docs.

Key Takeaways

1. Understand problem when working with Flickering when using background-image or mask-image.
2. Understand solution when working with Flickering when using background-image or mask-image.
3. Understand workaround when working with Flickering when using background-image or mask-image.
4. Understand see also when working with Flickering when using background-image or mask-image.

Connects To

• Cors Issues: related page in the Troubleshooting & Errors section.
• Enametoolong: related page in the Troubleshooting & Errors section.
• Font Picker: related page in the Troubleshooting & Errors section.