{"guid":"29678965-8b0b-5428-b63f-4de3a79b0a47","title":"CSS Clicker Training: Making games in a \"styling\" language","subtitle":null,"slug":"39c3-css-clicker-training-making-games-in-a-styling-language","link":"https://events.ccc.de/congress/2025/hub/event/detail/css-clicker-training-making-games-in-a-styling-language","description":"CSS is a programming language, and you can make games in it. Let's install NoScript and make some together!\n\nThis talk is about how HTML and CSS can be used to make interactive art and games, without using any JS or server-side code.\n\nI'll explain some of the classic Cohost CSS Crimes, how I made [CSS Clicker](https://lyra.horse/css-clicker/), and what's next for the CSS scene.\n\nI hope this talk will teach and/or inspire you to make cool stuff of your own!\n\n---\n\n*Content notes:*\n- Slides feature animations and visual effects\n- Short video clip (with music) will be played\n- Clicker sound at the end of the talk\n\n---\n\nSlides will be available after the talk at:  [https://lyra.horse/slides/#2025-congress](https://lyra.horse/slides/#2025-congress)\n\nLicensed to the public under http://creativecommons.org/licenses/by/4.0","original_language":"eng","persons":["Lyra Rebane"],"tags":["1215","2025","39c3","Art \u0026 Beauty","Ground","39c3-eng","39c3-deu","39c3-lav","Day 2"],"view_count":10400,"promoted":false,"date":"2025-12-28T21:05:00.000+01:00","release_date":"2025-12-29T00:00:00.000+01:00","updated_at":"2026-04-12T02:00:03.267+02:00","length":2390,"duration":2390,"thumb_url":"https://static.media.ccc.de/media/congress/2025/1215-29678965-8b0b-5428-b63f-4de3a79b0a47.jpg","poster_url":"https://static.media.ccc.de/media/congress/2025/1215-29678965-8b0b-5428-b63f-4de3a79b0a47_preview.jpg","timeline_url":"https://static.media.ccc.de/media/congress/2025/1215-29678965-8b0b-5428-b63f-4de3a79b0a47.timeline.jpg","thumbnails_url":"https://static.media.ccc.de/media/congress/2025/1215-29678965-8b0b-5428-b63f-4de3a79b0a47.thumbnails.vtt","frontend_link":"https://media.ccc.de/v/39c3-css-clicker-training-making-games-in-a-styling-language","url":"https://api.media.ccc.de/public/events/29678965-8b0b-5428-b63f-4de3a79b0a47","conference_title":"39C3: Power Cycles","conference_url":"https://api.media.ccc.de/public/conferences/39c3","related":[],"recordings":[{"size":491,"length":2390,"mime_type":"video/webm;codecs=av01","language":"eng-deu-lav","filename":"39c3-1215-eng-deu-lav-CSS_Clicker_Training_Making_games_in_a_styling_language_av1-hd.webm","state":"new","folder":"av1-hd","high_quality":true,"width":1920,"height":1080,"updated_at":"2025-12-29T22:19:48.443+01:00","recording_url":"https://cdn.media.ccc.de/congress/2025/av1-hd/39c3-1215-eng-deu-lav-CSS_Clicker_Training_Making_games_in_a_styling_language_av1-hd.webm","url":"https://api.media.ccc.de/public/recordings/95175","event_url":"https://api.media.ccc.de/public/events/29678965-8b0b-5428-b63f-4de3a79b0a47","conference_url":"https://api.media.ccc.de/public/conferences/39c3"},{"size":null,"length":null,"mime_type":"text/vtt","language":"eng","filename":"1215-29678965-8b0b-5428-b63f-4de3a79b0a47-eng.vtt","state":"auto","folder":"","high_quality":true,"width":null,"height":null,"updated_at":"2025-12-30T14:10:19.424+01:00","recording_url":"https://cdn.media.ccc.de/congress/2025/1215-29678965-8b0b-5428-b63f-4de3a79b0a47-eng.vtt","url":"https://api.media.ccc.de/public/recordings/95581","event_url":"https://api.media.ccc.de/public/events/29678965-8b0b-5428-b63f-4de3a79b0a47","conference_url":"https://api.media.ccc.de/public/conferences/39c3"},{"size":599,"length":2390,"mime_type":"video/webm","language":"eng-deu-lav","filename":"39c3-1215-eng-deu-lav-CSS_Clicker_Training_Making_games_in_a_styling_language_webm-hd.webm","state":"new","folder":"webm-hd","high_quality":true,"width":1920,"height":1080,"updated_at":"2025-12-29T21:36:34.563+01:00","recording_url":"https://cdn.media.ccc.de/congress/2025/webm-hd/39c3-1215-eng-deu-lav-CSS_Clicker_Training_Making_games_in_a_styling_language_webm-hd.webm","url":"https://api.media.ccc.de/public/recordings/95125","event_url":"https://api.media.ccc.de/public/events/29678965-8b0b-5428-b63f-4de3a79b0a47","conference_url":"https://api.media.ccc.de/public/conferences/39c3"},{"size":185,"length":2390,"mime_type":"video/webm","language":"eng-deu-lav","filename":"39c3-1215-eng-deu-lav-CSS_Clicker_Training_Making_games_in_a_styling_language_webm-sd.webm","state":"new","folder":"webm-sd","high_quality":false,"width":720,"height":576,"updated_at":"2025-12-29T21:31:05.573+01:00","recording_url":"https://cdn.media.ccc.de/congress/2025/webm-sd/39c3-1215-eng-deu-lav-CSS_Clicker_Training_Making_games_in_a_styling_language_webm-sd.webm","url":"https://api.media.ccc.de/public/recordings/95121","event_url":"https://api.media.ccc.de/public/events/29678965-8b0b-5428-b63f-4de3a79b0a47","conference_url":"https://api.media.ccc.de/public/conferences/39c3"},{"size":224,"length":2390,"mime_type":"video/mp4","language":"eng-deu-lav","filename":"39c3-1215-eng-deu-lav-CSS_Clicker_Training_Making_games_in_a_styling_language_sd.mp4","state":"new","folder":"h264-sd","high_quality":false,"width":720,"height":576,"updated_at":"2025-12-29T21:10:28.014+01:00","recording_url":"https://cdn.media.ccc.de/congress/2025/h264-sd/39c3-1215-eng-deu-lav-CSS_Clicker_Training_Making_games_in_a_styling_language_sd.mp4","url":"https://api.media.ccc.de/public/recordings/95112","event_url":"https://api.media.ccc.de/public/events/29678965-8b0b-5428-b63f-4de3a79b0a47","conference_url":"https://api.media.ccc.de/public/conferences/39c3"},{"size":25,"length":2390,"mime_type":"audio/opus","language":"deu","filename":"39c3-1215-deu-CSS_Clicker_Training_Making_games_in_a_styling_language_opus-2.opus","state":"new","folder":"opus-translation","high_quality":false,"width":0,"height":0,"updated_at":"2025-12-29T21:07:38.686+01:00","recording_url":"https://cdn.media.ccc.de/congress/2025/opus-translation/39c3-1215-deu-CSS_Clicker_Training_Making_games_in_a_styling_language_opus-2.opus","url":"https://api.media.ccc.de/public/recordings/95108","event_url":"https://api.media.ccc.de/public/events/29678965-8b0b-5428-b63f-4de3a79b0a47","conference_url":"https://api.media.ccc.de/public/conferences/39c3"},{"size":36,"length":2390,"mime_type":"audio/mpeg","language":"eng","filename":"39c3-1215-eng-CSS_Clicker_Training_Making_games_in_a_styling_language_mp3.mp3","state":"new","folder":"mp3","high_quality":false,"width":0,"height":0,"updated_at":"2025-12-29T21:07:00.000+01:00","recording_url":"https://cdn.media.ccc.de/congress/2025/mp3/39c3-1215-eng-CSS_Clicker_Training_Making_games_in_a_styling_language_mp3.mp3","url":"https://api.media.ccc.de/public/recordings/95106","event_url":"https://api.media.ccc.de/public/events/29678965-8b0b-5428-b63f-4de3a79b0a47","conference_url":"https://api.media.ccc.de/public/conferences/39c3"},{"size":25,"length":2390,"mime_type":"audio/opus","language":"eng","filename":"39c3-1215-eng-CSS_Clicker_Training_Making_games_in_a_styling_language_opus.opus","state":"new","folder":"opus","high_quality":false,"width":0,"height":0,"updated_at":"2025-12-29T21:06:20.725+01:00","recording_url":"https://cdn.media.ccc.de/congress/2025/opus/39c3-1215-eng-CSS_Clicker_Training_Making_games_in_a_styling_language_opus.opus","url":"https://api.media.ccc.de/public/recordings/95105","event_url":"https://api.media.ccc.de/public/events/29678965-8b0b-5428-b63f-4de3a79b0a47","conference_url":"https://api.media.ccc.de/public/conferences/39c3"},{"size":36,"length":2390,"mime_type":"audio/mpeg","language":"deu","filename":"39c3-1215-deu-CSS_Clicker_Training_Making_games_in_a_styling_language_mp3-2.mp3","state":"new","folder":"mp3-translated","high_quality":false,"width":0,"height":0,"updated_at":"2025-12-29T21:06:03.245+01:00","recording_url":"https://cdn.media.ccc.de/congress/2025/mp3-translated/39c3-1215-deu-CSS_Clicker_Training_Making_games_in_a_styling_language_mp3-2.mp3","url":"https://api.media.ccc.de/public/recordings/95104","event_url":"https://api.media.ccc.de/public/events/29678965-8b0b-5428-b63f-4de3a79b0a47","conference_url":"https://api.media.ccc.de/public/conferences/39c3"},{"size":924,"length":2390,"mime_type":"video/mp4","language":"eng-deu-lav","filename":"39c3-1215-eng-deu-lav-CSS_Clicker_Training_Making_games_in_a_styling_language_hd.mp4","state":"new","folder":"h264-hd","high_quality":true,"width":1920,"height":1080,"updated_at":"2025-12-29T21:02:33.564+01:00","recording_url":"https://cdn.media.ccc.de/congress/2025/h264-hd/39c3-1215-eng-deu-lav-CSS_Clicker_Training_Making_games_in_a_styling_language_hd.mp4","url":"https://api.media.ccc.de/public/recordings/95101","event_url":"https://api.media.ccc.de/public/events/29678965-8b0b-5428-b63f-4de3a79b0a47","conference_url":"https://api.media.ccc.de/public/conferences/39c3"},{"size":614,"length":2390,"mime_type":"video/mp4","language":"lav","filename":"39c3-1215-lav-CSS_Clicker_Training_Making_games_in_a_styling_language.mp4","state":"new","folder":"h264-hd","high_quality":true,"width":1920,"height":1080,"updated_at":"2025-12-29T21:02:14.433+01:00","recording_url":"https://cdn.media.ccc.de/congress/2025/h264-hd/39c3-1215-lav-CSS_Clicker_Training_Making_games_in_a_styling_language.mp4","url":"https://api.media.ccc.de/public/recordings/95100","event_url":"https://api.media.ccc.de/public/events/29678965-8b0b-5428-b63f-4de3a79b0a47","conference_url":"https://api.media.ccc.de/public/conferences/39c3"},{"size":614,"length":2390,"mime_type":"video/mp4","language":"deu","filename":"39c3-1215-deu-CSS_Clicker_Training_Making_games_in_a_styling_language.mp4","state":"new","folder":"h264-hd","high_quality":true,"width":1920,"height":1080,"updated_at":"2025-12-29T21:01:59.141+01:00","recording_url":"https://cdn.media.ccc.de/congress/2025/h264-hd/39c3-1215-deu-CSS_Clicker_Training_Making_games_in_a_styling_language.mp4","url":"https://api.media.ccc.de/public/recordings/95099","event_url":"https://api.media.ccc.de/public/events/29678965-8b0b-5428-b63f-4de3a79b0a47","conference_url":"https://api.media.ccc.de/public/conferences/39c3"},{"size":615,"length":2390,"mime_type":"video/mp4","language":"eng","filename":"39c3-1215-eng-CSS_Clicker_Training_Making_games_in_a_styling_language.mp4","state":"new","folder":"h264-hd","high_quality":true,"width":1920,"height":1080,"updated_at":"2025-12-29T21:01:44.670+01:00","recording_url":"https://cdn.media.ccc.de/congress/2025/h264-hd/39c3-1215-eng-CSS_Clicker_Training_Making_games_in_a_styling_language.mp4","url":"https://api.media.ccc.de/public/recordings/95098","event_url":"https://api.media.ccc.de/public/events/29678965-8b0b-5428-b63f-4de3a79b0a47","conference_url":"https://api.media.ccc.de/public/conferences/39c3"}]}