51:I[267044,["/creators-assets/_next/static/immutable/chunks/356g_j0l71_46.js","/creators-assets/_next/static/immutable/chunks/05lj3a0qaa006.js","/creators-assets/_next/static/immutable/chunks/0x8sumr53pdkk.js","/creators-assets/_next/static/immutable/chunks/3pud1dqsw0-_7.js","/creators-assets/_next/static/immutable/chunks/1m75iqpnspynu.js","/creators-assets/_next/static/immutable/chunks/0c6romi9ma0is.js","/creators-assets/_next/static/immutable/chunks/382a8k30zyobj.js","/creators-assets/_next/static/immutable/chunks/368p63l4oh_7-.js","/creators-assets/_next/static/immutable/chunks/325i2v5l4tnlq.js","/creators-assets/_next/static/immutable/chunks/228u8o-g1d1_g.js","/creators-assets/_next/static/immutable/chunks/2b1mm8iiske-y.js","/creators-assets/_next/static/immutable/chunks/0i7m0zg6jfazw.js","/creators-assets/_next/static/immutable/chunks/3-hmotkz_bdv_.js","/creators-assets/_next/static/immutable/chunks/06bqtx1jsc1kz.js","/creators-assets/_next/static/immutable/chunks/3q5wansxm4vp6.js","/creators-assets/_next/static/immutable/chunks/14h9277o22-rl.js","/creators-assets/_next/static/immutable/chunks/3naniu4pnqfyw.js","/creators-assets/_next/static/immutable/chunks/2-y_r3u4wh2s3.js","/creators-assets/_next/static/immutable/chunks/456d4lcv9-syj.js","/creators-assets/_next/static/immutable/chunks/36-o7-3julke0.js","/creators-assets/_next/static/immutable/chunks/2xq6uu2rcdc2i.js","/creators-assets/_next/static/immutable/chunks/413kuej600yyw.js","/creators-assets/_next/static/immutable/chunks/1v3f42-oqro9g.js","/creators-assets/_next/static/immutable/chunks/3e73rezw4k1a2.js","/creators-assets/_next/static/immutable/chunks/2di2v55rtz-8i.js","/creators-assets/_next/static/immutable/chunks/1fkcqskfw4hol.js","/creators-assets/_next/static/immutable/chunks/146b7x-3yl4nl.js","/creators-assets/_next/static/immutable/chunks/3g6klxxyg4m8-.js","/creators-assets/_next/static/immutable/chunks/40oma2w708rd-.js","/creators-assets/_next/static/immutable/chunks/3_pg4jxj9aiiw.js","/creators-assets/_next/static/immutable/chunks/2fvzgkzqkig_w.js","/creators-assets/_next/static/immutable/chunks/0qx5rzvbsd7bx.js","/creators-assets/_next/static/immutable/chunks/0l9v835j421-s.js","/creators-assets/_next/static/immutable/chunks/3b306xa-3tb7g.js","/creators-assets/_next/static/immutable/chunks/3k6sa9ujkqb5c.js","/creators-assets/_next/static/immutable/chunks/00owjoob9gqs9.js","/creators-assets/_next/static/immutable/chunks/2x7-2b3jcc9x7.js"],"S"] 52:T96a,

About

Playful Toggle is a gamified switch designed to add personality and interaction to your Framer projects. Built for flexibility, it is fully customizable, allowing you to quickly adjust colors and styling to match any brand or interface. Smooth and easy to drop into your workflow, this toggle turns a simple action into a delightful micro-interaction.

Instructions

Add to Project: Copy and paste the Playful Toggle component into your Framer project
Customization: Click the component and access all the properties in the right panel (colors, radius, squircleness, transition...)
Preview & Iterate: Tweak and customize it freely to match your style and make it uniquely yours

Overview

Playful Toggle Customization Panel

Features

Micro-Interaction Focused: Turns a simple toggle into a playful, tactile UI moment
Squircle Control: Easily adjust between sharp and soft geometry
Inner Depth: Optional inner shadow for a subtle dimensional feel
Design System Friendly: Cleanly integrates into modern UI systems
Accessibility Ready: Minimum press area of 44px by 44px for comfortable interaction
Framer Panel Driven: All key adjustments exposed directly in the properties panel for fast iteration
Native Framer Build: No code required, built entirely with Framer’s native tools

Why Pick This?

Playful Toggle is built to bring a bit more life into everyday interactions without adding complexity to your workflow. It is lightweight, fully native to Framer, and designed to be easy to tweak so you can quickly make it your own.

Made with love&hate by Shady

For anything, here's where you can reach me: shady.khalaile@gmail.com

50:["$","$L51",null,{"value":{"fallback":{"$inf$activity-creator-7c23bf67-c588-49dd-b196-972766c6e99f-all:/unified/creator/7c23bf67-c588-49dd-b196-972766c6e99f/activity/":[{"data":[{"id":"01a11cbb-7e71-77ed-80c2-2602fb2e07ec","type":"site.created","target":{"type":"site","id":"18207","preview":"Venezia Prossima","previewJson":null,"thumbnail":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/7c23bf67-c588-49dd-b196-972766c6e99f/01a11cb8-a7fe-73f1-a33f-8df483722bf1.png","targetDeleted":false,"owned":false,"actions":null},"context":null,"actors":[{"id":"7c23bf67-c588-49dd-b196-972766c6e99f","name":"Shady","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/7c23bf67-c588-49dd-b196-972766c6e99f/r5qgk69q","slug":"shady","followed":false,"followsYou":false}],"actorCount":1,"message":null,"resourceType":"site","visibility":"public","startedAt":"2026-10-08T18:16:52.081Z","latestAt":"2026-10-08T18:16:52.081Z"}],"pagination":{"next":null,"previous":null},"totalCount":"$undefined","feedSession":"$undefined"}],"$inf$posts:7c23bf67-c588-49dd-b196-972766c6e99f:/unified/posts/?creator=7c23bf67-c588-49dd-b196-972766c6e99f&with=reposts":[{"data":[{"id":"01a11cbb-7bd6-701e-adea-ba6406bef948","title":null,"body":"

Recently, I had the chance to design the full branding and build the new website for Venezia Prossima.

The goal was to create a warm, human-centered identity and digital experience through organic shapes, expressive typography, thoughtful animations, and small details that bring the brand to life.

","bodyJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"Recently, I had the chance to design the full branding and build the new website for Venezia Prossima."}]},{"type":"paragraph","content":[{"type":"text","text":"The goal was to create a warm, human-centered identity and digital experience through organic shapes, expressive typography, thoughtful animations, and small details that bring the brand to life."}]}]},"author":{"framerUserId":"7c23bf67-c588-49dd-b196-972766c6e99f","name":"Shady","slug":"shady","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/7c23bf67-c588-49dd-b196-972766c6e99f/r5qgk69q","badges":["available","expert"],"followed":false,"followsYou":false},"media":[],"resources":[{"id":"18207","resolved":true,"title":"Venezia Prossima","body":"

A human-centered website for Venezia Prossima, designed to communicate their mission, showcase their impact, and make donating or volunteering feel simple and accessible.

The visual language combines organic shapes, expressive typography, carefully crafted animations, and thoughtful micro-interactions.

Every detail was designed to create a warm, approachable experience while giving the organization a distinctive digital identity that reflects its community-driven values.

","bodyJson":{"type":"doc","content":[{"type":"paragraph","content":[{"type":"text","text":"A human-centered website for Venezia Prossima, designed to communicate their mission, showcase their impact, and make donating or volunteering feel simple and accessible. "}]},{"type":"paragraph","content":[{"type":"text","text":"The visual language combines organic shapes, expressive typography, carefully crafted animations, and thoughtful micro-interactions. "}]},{"type":"paragraph","content":[{"type":"text","text":"Every detail was designed to create a warm, approachable experience while giving the organization a distinctive digital identity that reflects its community-driven values."}]}]},"introduction":"","slug":"venezia-prossima","author":{"framerUserId":"7c23bf67-c588-49dd-b196-972766c6e99f","name":"Shady","slug":"shady","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/7c23bf67-c588-49dd-b196-972766c6e99f/r5qgk69q","badges":["available","expert"],"followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/7c23bf67-c588-49dd-b196-972766c6e99f/01a11cb8-a7fe-73f1-a33f-8df483722bf1.png","metadata":{"tint":{"h":20,"s":55,"l":17},"width":1552,"height":1164}},{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/7c23bf67-c588-49dd-b196-972766c6e99f/01a11cb9-edc1-74ae-ad0c-59884579ae62.png","metadata":{"tint":{"h":0,"s":0,"l":57},"width":1552,"height":1164}},{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/7c23bf67-c588-49dd-b196-972766c6e99f/01a11cb9-7e75-76d0-9e33-d51810d446ec.png","metadata":{"tint":{"h":0,"s":0,"l":57},"width":1552,"height":1164}},{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/7c23bf67-c588-49dd-b196-972766c6e99f/01a11cba-00fe-7342-a7af-611fe64440db.png","metadata":{"tint":{"h":0,"s":0,"l":57},"width":1552,"height":1164}},{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/7c23bf67-c588-49dd-b196-972766c6e99f/01a11cb9-976d-71e9-8952-3609151157ff.png","metadata":{"tint":{"h":0,"s":40,"l":16},"width":1552,"height":1164}}],"post":null,"createdAt":"2026-10-08T18:16:50.728Z","updatedAt":"2026-10-08T18:16:50.728Z","publishedAt":"2026-10-08T18:16:50.724Z","featuredAt":null,"approvedAt":null,"type":"site","attributes":{"url":"https://veneziaprossima.it/","categories":[{"id":"d26c907e-7d56-4582-9727-b7c10921b71e","name":"Community","slug":"community"}],"mainCategory":null,"tags":[]}}],"contests":[],"categories":[],"tags":[],"likes":{"count":4,"liked":false},"comments":{"count":0},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2026-10-08T18:16:51.414Z","updatedAt":"2026-10-08T18:16:51.414Z"},{"id":"019ca4eb-4085-7635-a492-4abfb0dfffc5","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"7c23bf67-c588-49dd-b196-972766c6e99f","name":"Shady","slug":"shady","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/7c23bf67-c588-49dd-b196-972766c6e99f/r5qgk69q","badges":["available","expert"],"followed":false,"followsYou":false},"media":[],"resources":[{"id":"hXh1sUyx4bsAtPSId8Sw","resolved":true,"title":"Playful Toggle","body":"$52","bodyJson":null,"introduction":"Playful on/off switch for Framer","slug":"playful-toggle","author":{"framerUserId":"7c23bf67-c588-49dd-b196-972766c6e99f","name":"Shady","slug":"shady","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/7c23bf67-c588-49dd-b196-972766c6e99f/r5qgk69q","badges":["available","expert"],"followed":false,"followsYou":false},"media":[{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/hXh1sUyx4bsAtPSId8Sw/playful-toggle-qg8FQsdbG8Y3xGeqgilKD7W2yvdxBl","metadata":{"tint":{"h":150,"s":57,"l":22},"width":1600,"height":1200}}],"post":null,"createdAt":"2026-02-23T01:01:36.584Z","updatedAt":"2026-02-28T15:42:37.469Z","publishedAt":"2026-02-28T15:43:26.853Z","featuredAt":null,"approvedAt":null,"type":"component","attributes":{"url":"https://hy.chujiqiqi.com/m/Playful-Toggle-srPbM4.js@wHs1F5x57kyPeTqlgriW","previewUrl":"https://cherished-lot-496619.framer.app/","price":null,"paymentUrl":null,"workshop":false,"categories":[{"id":"cd81cc33-d6cf-4630-8e59-b5b3100166ba","name":"Buttons","slug":"buttons"}],"lastSaveId":"wHs1F5x57kyPeTqlgriW","tags":[]}}],"contests":[],"categories":[],"tags":[],"likes":{"count":5,"liked":false},"comments":{"count":0},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2026-02-28T15:43:26.853Z","updatedAt":"2026-02-28T15:43:26.853Z"},{"id":"019bad60-7043-78f6-8ee1-d44db3e2232e","title":null,"body":null,"bodyJson":null,"author":{"framerUserId":"7c23bf67-c588-49dd-b196-972766c6e99f","name":"Shady","slug":"shady","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/7c23bf67-c588-49dd-b196-972766c6e99f/r5qgk69q","badges":["available","expert"],"followed":false,"followsYou":false},"media":[],"resources":[{"id":"11628","resolved":true,"title":"8bit Shady","body":null,"bodyJson":null,"introduction":"8bit Shady is my portfolio and it gathers my proudest and latest projects in an old 8bit retro styled visual design.","slug":"8bit-shady","author":{"framerUserId":"7c23bf67-c588-49dd-b196-972766c6e99f","name":"Shady","slug":"shady","avatar":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/media/7c23bf67-c588-49dd-b196-972766c6e99f/r5qgk69q","badges":["available","expert"],"followed":false,"followsYou":false},"media":[{"type":"video","url":"https://stream.mux.com/CaVWZ8lOM9af5NxvjAL13RGrffnKX3EDhAUGEIt7yiM.m3u8","metadata":{"posterUrl":"https://image.mux.com/CaVWZ8lOM9af5NxvjAL13RGrffnKX3EDhAUGEIt7yiM/thumbnail.webp?time=40.88","aspectRatio":"4:3","duration":71.12}},{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/sites/11628/thumbnail.jpg","metadata":{"tint":{"h":0,"s":0,"l":3},"width":1600,"height":1200}},{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/sites/11628/screenshotOne.jpg","metadata":{"tint":{"h":0,"s":0,"l":24},"width":1600,"height":1200}},{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/sites/11628/screenshotTwo.jpg","metadata":{"tint":{"h":0,"s":0,"l":57},"width":1600,"height":1200}},{"type":"image","url":"https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/sites/11628/screenshotThree.jpg","metadata":{"tint":{"h":0,"s":0,"l":3},"width":1600,"height":1200}}],"post":null,"createdAt":"2026-01-11T14:05:37.217Z","updatedAt":"2026-02-20T10:58:14.957Z","publishedAt":"2026-01-11T14:05:37.219Z","featuredAt":null,"approvedAt":null,"type":"site","attributes":{"url":"https://8bitshady.com/","categories":[{"id":"6a730e3d-bdf2-42a2-ab42-eee5ef39b694","name":"Portfolio","slug":"portfolio"}],"mainCategory":null,"tags":[]}}],"contests":[],"categories":[],"tags":[],"likes":{"count":2,"liked":false},"comments":{"count":0},"reposts":{"count":0,"reposted":false,"repostId":null},"version":1,"edited":false,"editedAt":null,"createdAt":"2026-01-11T14:05:37.219Z","updatedAt":"2026-01-11T14:05:37.219Z"}],"pagination":{"next":null,"previous":null},"totalCount":"$undefined","feedSession":"$undefined"}]}},"children":"$L53"}]