Enforce Tailwind v4 browser runtime compliance in HyperFrames video compositions.
npx skills add https://github.com/automatedigital/spark --skill tailwind-automatedigital
Please help me install this Agent Skill. Skill: tailwind Source: https://github.com/automatedigital/spark/tree/main/skills/creative/tailwind Command: npx skills add https://github.com/automatedigital/spark --skill tailwind-automatedigital
This Skill resolves common Tailwind CSS styling failures in HyperFrames video compositions, including missing styles on frame 0, v3-to-v4 syntax conflicts, and incorrect browser runtime configuration that cause wasted debugging time and broken render outputs.
hyperframes init --tailwind and see missing styles in your video render, this Skill walks you through verifying the runtime, fixing v4 syntax, and running validation to resolve the issue.Use the tailwind skill to fix missing Tailwind styles in your HyperFrames video composition and confirm the render outputs correctly.
High-intent search queries and answers about installing and using this skill.
To fix missing Tailwind styles, verify the pinned @tailwindcss/[email protected] runtime contract, remove deprecated v3 patterns like @tailwind directives, apply v4 CSS-first configuration rules, and run the official validation commands to confirm render-ready outputs.
Migrating Tailwind CSS from v3 to v4 for HyperFrames requires removing tailwind.config.js and @tailwind directives, adopting v4 CSS-first theme tokens, and enforcing the pinned @tailwindcss/[email protected] runtime to ensure deterministic and seekable video frame rendering.
Yes, HyperFrames works with the Tailwind v4 browser runtime by enforcing the pinned @tailwindcss/[email protected] contract. This ensures utility classes and CSS custom properties render deterministically across seekable video frames without style drops.
The best way to resolve dynamic class safety risks in Tailwind video compositions is to follow pre-vetted utility class combinations and apply the provided validation workflow checklist to confirm render-ready outputs before finalizing the HyperFrames project.
Yes, after scaffolding with hyperframes init --tailwind, you need to run validation commands to check the browser runtime configuration, verify v4 syntax compliance, and ensure all utility classes produce render-ready styles for your video output.
1vesoManages Tailwind CSS v4.2 browser-runtime patterns for HyperFrames compositions.
Sma1lboyAuthor deterministic video compositions from HTML, CSS, and GSAP.
KamalabotConfigure Tailwind v4 browser runtime and CSS-first themes for HyperFrames video compositions.
baasith6Convert CSS selectors, properties, and rules to Tailwind CSS utility classes.