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.

Palettes, gradients and animated color in OKLCH v1.0.0

Use this resource to build a palette and animated gradients for a motion piece

New

  • 354 downloads
  • 107 likes
  • 173 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 color-in-motion

With no option, the skill goes to ~/.agents/skills/; add --agent claude-code (or codex, cursor…) to target an agent.

First time: connect the CLI with

npx --yes palatekit@latest login

The agent composes a palette with few hues and exact OKLCH values, builds gradients that stay vivid by interpolating in a perceptual space, and animates color transitions. It also explains how to grade a video for mood and fix washed-out or platform-inconsistent renders. You get gradient code, color values and export settings.

Mostly picked by

Updated November 2, 2026

Vivid mesh gradient interpolated in OKLCH with a restrained palette

Details

Works in
Install guides
Generates with
Your agent's model
Uses
  • After Effects (optional, for the video render part)
Licence
MIT

Similar resources

View all

What you get

  • SKILL.md: restrained palette, OKLCH interpolation, mesh gradients, transitions, grading order, video color management
  • references/palettes-and-interpolation.md: named recipes, mesh and conic gradients, culori and d3-interpolate code
  • references/color-management.md: After Effects diagnosis tree, per-platform export, ffprobe tag checks

Good fit for

  • Choosing a palette and gradients for a brand video or page
  • Fixing gradients that pass through a muddy gray
  • Understanding why a render looks washed out outside After Effects

Not for

  • Picking a Pantone code for print
  • Replacing a professional colorist on a feature film

Tags

  • color
  • oklch
  • gradient
  • palette
  • grading

About

You say

"Give me a dark palette with an amber accent and a slow animated gradient for my home page background."

Vivid mesh gradient interpolated in OKLCH with a restrained palette

Skill published by iart-ai under the MIT license.

Show more

Prerequisites

You bring
The mood and any existing brand colors and The target medium: web page or video
Dependencies
After Effects (optional, for the video render part)

How to use it

  1. Install the skill in your agent's skills folder.
  2. Describe the mood, the brand and the medium (web page or video).
  3. Take the color values and code, then check the result at several moments.

Content preview

Files

  • LICENSE1.1 KB
  • NOTICE-PALATEKIT.md0.4 KB
  • references/color-management.md11.7 KB
  • references/palettes-and-interpolation.md6.8 KB
  • SKILL.md11.8 KB

Origin and licence

Modified by PalateKit

Author
iart-ai
Source
github.com/iart-ai/motion-design-skills/tree/3c129f769d90a1328c209c386492333c9ac62312/skills/color-motion
Licence
MIT

Notice

Version modifiée de « color-motion » (iart-ai, MIT) : 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

What is OKLCH?

A color space where lightness, chroma and hue are set separately. It avoids the gray midpoints of sRGB gradients and works natively in CSS.

Do I need After Effects?

Not unless you apply the video render part. Palettes and gradients work in plain HTML and CSS. The helper scripts it mentions (scripts/) are not included and are optional.