Rock Paper Scissors

Rock Paper Scissors

About Rock Paper Scissors

About

Rock Paper Scissors adds a classic, interactive mini-game to your Framer projects. It’s the perfect way to add a bit of "delight" to your site, keeping visitors engaged for longer. Drop it into a 404 page, a "Fun" section of your portfolio, or a sidebar and let users challenge the AI. With built-in themes like "Neon" and fully responsive controls, it fits seamlessly into any design.

What it does

The component renders a complete game interface where players can compete against an AI. It tracks game history (wins/losses/draws), and features an optional "AI Learning" mode where the computer adapts to the player's patterns. It handles all game logic internally, including difficulty scaling and UI updates, ensuring a smooth experience across desktop and mobile.

What you can customize

  • Game Logic: Set the Player Name, choose AI Difficulty (Easy, Medium, Hard), and toggle "AI Learning" on or off to change how the computer plays.

  • Visuals & Themes: Choose from preset Themes (like Neon), adjust the Grid Corner Radius for a sharp or rounded look, and control the History Length to show as many past rounds as you like.

  • Typography: Full control over Heading, Body, and Button fonts (using Inter or any custom font) to ensure the game matches your brand perfectly.

Great for

  • 404 / Error pages to keep frustrated users on-site.

  • "About" or "Contact" pages as a fun icebreaker.

  • Portfolio and agency sites to showcase interactive capabilities.

  • Dashboards and landing pages to increase "Time on Site" metrics.

  • "Just for fun" sections in community or blog layouts.

Share your build

If you ship something cool with it, post it on X and tag me @Dulajweb, or send it over. I’d love to see what you create.

Need help?

Questions or feedback? Reach me anytime: dulajdilshan766@gmail.com or on X @Dulajweb