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.

Animated US hex grid map v1.0.0

Use this resource to present one value per US state in a video

New

  • 369 downloads
  • 243 likes
  • 213 saves

$4.99

Lifetime access to this resource, with its updates.

Install with the CLI

In a terminal, from the folder you want:

npx --yes palatekit@latest install us-hex-grid-map

First time: connect the CLI with

npx --yes palatekit@latest login

The agent adds a hexagonal tile grid map where every state carries the same weight, so large states do not overwhelm small ones. The hexagons appear one by one with the state abbreviation and a color from the data. The sample shows median household income.

Mostly picked by

Updated November 2, 2026

Details

Works in
Install guides
Generates with
HyperFrames
Uses
  • HyperFrames
  • Node.js
  • FFmpeg
Licence
Apache-2.0

Similar resources

View all

What you get

  • us-map-hex.html: ready-to-use HyperFrames composition (1920x1080, 10 s)
  • README.md: usage guide (installation, variables, render)
  • registry-item.json: block install manifest

Good fit for

  • Presenting results by state to a client or a team.
  • Illustrating a research topic or a statistical study in video.
  • Showing the spread of your sales or customers across the United States.

Not for

  • A map of a country other than the United States.
  • A map true to real borders and surface areas.

Tags

  • map
  • data
  • visualization
  • usa

About

You say

"Show my sales growth rate by US state on the hex map, from lowest to highest."

US map made of colored hexagons by value, with headline, gradient legend and source line.

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

Show more

Prerequisites

You bring
Your data by state (one value per state) and The headline, subtitle and source to display
Dependencies
HyperFrames, Node.js, and FFmpeg

How to use it

  1. Install HyperFrames in your video project, then add the block.
  2. Ask your agent to adapt texts, colors and timings to your content.
  3. Run the render to get the video.

Content preview

Files

  • LICENSE10.5 KB
  • NOTICE-PALATEKIT.md0.4 KB
  • README.md1 KB
  • registry-item.json0.8 KB
  • us-map-hex.html15 KB

Origin and licence

Modified by PalateKit

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

Notice

Version modifiée de « US Hex Grid Map » (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 install it in my project?

Copy us-map-hex.html into the compositions/ folder of a HyperFrames project (with the assets/ folder if there is one), or ask your agent to run npx hyperframes add us-map-hex.

What can I customize?

You can change the headline, subtitle, source, legend and per-state values (data table in the HTML script). Ask your agent to adapt the file to your content.