NinA AI Agency

Like-knop

Hartje met een veerkrachtige tik, een explosie van stipjes en een teller.

KlikkenGratis
Werkt inClaude CodeChatGPT CodexGemini CLIGitHub CopilotCursorLovablev0

Prompt plus werkende code in één keer. Plak het in Claude Code, Codex, Gemini, Copilot of Cursor.

Bouw een interactief UI-element: Like-knop.

Wat het is: Hartje met een veerkrachtige tik, een explosie van stipjes en een teller.

Gedrag:
- Pilknop met een hartje en een teller.
- Klik: het hartje vult zich rood, de knop schaalt kort veerkrachtig (0,86 naar 1,12 naar 1) en acht stipjes schieten in een cirkel weg en vervagen.
- Nog een klik maakt het ongedaan, zonder animatie.
- De teller gaat één omhoog of omlaag; aria-pressed geeft de stand door.

Eisen:
- Werk in de stack van dit project. Is het React met Tailwind CSS, maak dan één component zonder extra pakketten; anders gewone HTML, CSS en JavaScript.
- Volledig bedienbaar met toetsenbord en touch, met de juiste aria-attributen.
- Respecteer prefers-reduced-motion: minder of geen beweging.
- Neem de kleuren, lettertypes en afrondingen van mijn project over.
- Laat me aan het eind zien waar het component staat en hoe ik het gebruik.

Speel verder

Automatiseren?

Offertes opstellen

Twee mensen, veertig minuten per stuk.

Automatiseren?

Klantvragen beantwoorden

Terugkerende vragen, elke dag weer.

JaLater

Automatiseren?

Facturen verwerken

180 per maand, nu met de hand ingevoerd.

Met e-mail
Kaarten swipenBekijk prompt en code