Every premium and members-only resource for $9.99/month, as a no-commitment subscription. See the plans

PalateKit

Sign in
Menu

Request a resource

Describe the resource you are missing in one sentence. We will email you when it is published.

0 / 280

A page, a video or an image online.

Unlock PalateKit

Unlock everything

Plan

Paying means accepting our terms of sale.

Secure payment by Stripe. Receipts and invoices sent by email.

Welcome back

Sign in to install, download or save this resource. A free account is enough for free resources.

Soft animated gradient, minimal presentation style v1.0.0

Use this resource to create a minimalist animated background for a video presentation

New

  • 445 downloads
  • 120 likes
  • 116 saves

Free

Install with the CLI

In a terminal, from the folder you want:

npx --yes palatekit@latest install soft-gradient-background

First time: connect the CLI with

npx --yes palatekit@latest login

The agent sets the light or dark theme, the position and size of the two blobs, their colors and the rounded card, which can go from full-bleed to a floating card. Frosted-glass mode blurs footage placed beneath. You get a 10-second background ready for text on top.

Mostly picked by

Updated November 2, 2026

Details

Works in
Install guides
Generates with
HyperFrames
Uses
  • HyperFrames (npm: hyperframes)
  • Node.js
  • FFmpeg (MP4 rendering)
Licence
Apache-2.0

Similar resources

View all

What you get

  • mk-background.html: the HyperFrames composition (1920×1080, 10 s)
  • Color variables for light and dark themes
  • A block description file (registry-item.json)
  • A preview video and image

Good fit for

  • The backdrop of a product presentation video
  • A background for quotes or key figures
  • A restrained setting for a brand video

Not for

  • A background with figurative patterns or textures
  • A 3D rendering
  • A video longer than 10 seconds without extending the duration

Tags

  • background
  • gradient
  • minimal
  • presentation

About

You say

"Make a dark purple gradient background for my launch video, with the card shrinking in the middle."

A light background with two large pink and teal gradient blobs drifting slowly.

Template published by HeyGen (HyperFrames) under the Apache-2.0 license.

Show more

Prerequisites

You bring
Your two brand colors and The theme, light or dark
Dependencies
HyperFrames (npm: hyperframes), Node.js, and FFmpeg (MP4 rendering)

How to use it

  1. Add the block to your HyperFrames project.
  2. Choose the theme and your two gradient colors.
  3. Preview, adjust the card, then render the background.

Content preview

Files

  • LICENSE10.5 KB
  • mk-background.html7.1 KB
  • NOTICE-PALATEKIT.md0.4 KB
  • README.md0.9 KB
  • registry-item.json0.7 KB

Origin and licence

Modified by PalateKit

Author
HeyGen (HyperFrames)
Source
github.com/heygen-com/hyperframes/tree/2c3d1e07fe63d4a2d67d63a3e29d4ad73e291d8e/registry/blocks/mk-background
Licence
Apache-2.0

Notice

Version modifiée de « Minimal Gradient Background » (HeyGen (HyperFrames), Apache-2.0) : traduction française et fiche par PalateKit.

User reviews

–

No ratings yet

Loading reviews…

Delete your review?

Your rating and comment will be removed from the page.

Frequently asked questions

How do I change the colors?

The --mk-blob-1 and --mk-blob-2 variables (and their dark versions) define the blobs. Replace them with your own hues.

What is the frosted mode for?

It blurs footage placed under the block: set frostBlur to about 24 pixels for the frosted card look.