Making the web more alive & fun
playhtml is an open-source library that adds live, persistent interactivity to HTML elements. Facilitate real-time interactions that stay over time without additional infrastructure.
turn the lightson/off for everyonecan-toggle
on every visit
for everyonecan-spin
rain for everyone
Why does the internet feel lonely when we spend so much of our time on it?
Personal feeds, content-focused sites, no trace of who else is here right now or who has been here before. playhtml empowers anyone to build shared, lived-in spaces on the open web instead of a closed platform. As people retreat to private forums with the rise of AI-generated content, I believe we have a duty to save and protect the open web for people. More about why
How it works
get started in a minute<div id="note" can-move> drag me</div> <script type="module" src= "https://unpkg.com/playhtml/ dist/init.es.js"></script>
Augment existing elements
Use preloaded capabilities for common interactions or customize how elements react to data changes.
Show changes live
Everyone on the page sees it as it is moved around.
it was left
Persist state across refreshes
Changed data is saved, so actions affect the page.
Made with playhtml
by people all over the webGet involved
pick a way inCome play with us
Regular events walking the web, sketching websites, and stewarding the web into a more human and empowering place.
see all past events →Activate your community
From cultural & educational institutions to brands & companies, we make people feel like active members in digital space—including hundreds of people walking the web together for Rhizome, dozens making small social websites for SFPC, and thousands of readers inhabiting over 50k pages on Wikipedia.
Support a shared internet
playhtml is designed to be public good infrastructure to keep the web alive. We host the servers for our community to make it accessible to a wide audience and continue to maintain and develop new features. We're supported by sponsors, from individuals chipping in to organizations committing larger support, that help make this work possible.
we were online
turning the internet into a living, shared space
playhtml makes your page a shared place. we were online brings that ethos to the entire web as you browse.
visit wewere.online- portraits turn your cursor trails, windows, & clicks into online portraits
- scraps collect images, buttons, etc. as you browse & make webcollages
- a shared internet world run into others & leave traces of your presence
Guestbook
↓ scroll to read older messagesQuestions
01Is it free?
Yes. There's no account, no API key and no plan to pick. Spencer hosts the shared server himself because he thinks a more playful, shared web should be a public good. It's free within limits that keep it safe from abuse and overload. If you hit a limit, get in touch. If you're building something large, run your own server. If playhtml is useful to you, sponsoring it helps keep it running for everyone.
02Where does my data live?
On a shared playhtml server, with one room per page URL. All data is public because it powers public websites. Please do not store private or sensitive data on playhtml. See the privacy policy for details. Down the line, we want people to own their data, with playhtml syncing through open, decentralized protocols like AT Protocol, so that developers can own their own data. In the meantime, you can run your own server to keep your data.
03Does this work with my website?
It should! If you code your own website, all it takes is adding the setup script and decorating your elements. If you're using a website builder like Squarespace, you will have to add custom scripts and do small modifications to the HTML of elements. It works natively with all HTML and JavaScript, and we have a React package, plus guides for Astro and other frameworks. Let us know if a framework you use is missing.
04What if the server is down?
Your page still loads as normal, but the shared data won't show
up. Built-in elements show their default state, fade gently and
can't be clicked until they connect. You can use
onError to show your own message.
05Can I use AI coding tools with it?
Yes. Our skill teaches your agent how playhtml works and asks you to make your design choices clear. We think of coding as sketching: a tool should help your idea come into focus, not fill in the blanks for you. As such, whether you use AI or code by hand, we encourage you to use tools to realize your own unique vision. It can definitely be a resource to try if you feel held back by technical capability.
06Who's funding this?
This is mostly self-funded by Spencer Chang through his creative practice. Generous sponsors, organizational grants, and partnerships with like-minded organizations support it as well. Please consider sponsoring or partnering to support this work if it resonates with you.