Drifting Marks Hero
+6Dark Stat Herov1.0.1
Use this Skill to create ui visuals.
5.015 downloads1 likes0 saves
$4.99
What do I get when I buy this Skill?Dark Stat Hero is a ready-to-paste hero section, delivered as editable source with its usage example. It ships with a scroll or step interaction the visitor drives and a responsive grid that reflows down to a phone. Colour, type and radius live as tokens you edit once for the whole block.
Picked most often by
Updated Aug 31, 2026
Similar Skills
View all skills
What you get
- The full source for Dark Stat Hero — the component file plus a runnable usage example, ready to paste and edit.
- A written visual contract: palette, type scale, radius, icon stroke and motion timings, all as tokens you edit in one place.
- Responsive breakpoints already tuned, from desktop down to a phone.
Good fit
- You need a hero section and want a finished one rather than a blank canvas.
- You want the first screen to look complete on render, with imagery already placed.
- You want readable source you can edit, not another dependency to keep upgraded.
Not for
- Teams already running a mature design system — this palette and type scale will fight yours.
- Anyone wanting a versioned npm package; this hands you source to maintain yourself.
- Projects needing navigation, forms, auth or checkout — none of which this block covers.
Brand IdentityProduct Launch & App GrowthDigital Publications & Web PagesCreate UI VisualsBuild Website PageBuild Landing PageEditable OutputVisually PolishedBeginner-friendlyWarm NeutralTeal AccentEditorial
About this Skill
You paste one block and the top of your page is finished — headline, supporting line, buttons and artwork already sitting right against each other. Nothing to lay out, nothing left grey.
What you get
- The full source for Dark Stat Hero — the component file plus a runnable usage example, ready to paste and edit.
- A written visual contract: palette, type scale, radius, icon stroke and motion timings, all as tokens you edit in one place.
- Responsive breakpoints already tuned, from desktop down to a phone.
How to use it
- Tell your assistant where the section goes and it reads your project first, then writes the block the way that project is already written.
- Replace the words with yours. The type sizes and spacing hold on their own.
- Change the accent colour in one place and the whole block follows.
- Look at it on a phone before you ship. It is already built to hold there.
What you need before you start
- Last tested
- v1.0.1 — Claude Code / Claude Desktop / Cowork / Codex / ChatGPT
User reviews
Loading reviews…