Git Product home page Git Product logo

awesome-css-houdini's Introduction

.Awesome-CSS-Houdini { Awesome }

A curated list of CSS Houdini resources.

🤔 Is Houdini ready yet‽

The first question that we do when we view a new technology, thanks to Surma we have a great table to see the status of APIs and the browsers support.

Is Houdini ready yet‽

Is Houdini ready yet‽

📚 Documentation

📖 Articles

Name APIs
CSS Houdini ⭐ Worklets Typed OM Custom Properties & Values API Paint API Animation Worklet Layout API
Houdini: Maybe The Most Exciting Development In CSS You’ve Never Heard Of Worklets Typed OM Custom Properties & Values API Paint API Animation Worklet Layout API Parser API
Houdini: Demystifying CSS Worklets Paint API Layout API Typed OM Custom Properties & Values API Font metrics
Say hello to Houdini and the CSS Paint API Paint API
What Houdini Means for Animating Transforms Animation Worklet
Working with the new CSS Typed Object Model Typed OM
New ways to make your web app jank with Houdini – An introduction Worklets Typed OM Custom Properties & Values API Paint API Layout API Font metrics Compositor Worklet
Exploring the CSS Paint API Paint API Custom Properties & Values API
Simple Interactive Pie Chart with CSS Variables and Houdini Magic Custom Properties & Values API
Houdini is like Babel but for CSS Typed OM Custom Properties & Values API Paint API Animation Worklet Layout API Parser API
A Houdini Quickstart: registerProperty Custom Properties & Values API
CSS Paint in Action: Bar Chart Paint API Custom Properties & Values API
The CSS Paint API Paint API
CSS Paint API Paint API
Houdini's Animation Worklet Animation Worklet

💻 Samples

Samples APIs
CSS Houdini 🤩 Worklets Typed OM Custom Properties & Values API Paint API Animation Worklet Layout API
CSS Houdini Experiments 🤩 Custom Properties & Values API Paint API Layout API
Houdini Samples (Google Chrome Labs) Custom Properties & Values API Paint API Animation Worklet Layout API
Houdini's CSS Paint Polyfill Paint API
Using Houdini CSS Paint API with Rough.js Paint API
Ana Tudor's Houdini samples Custom Properties & Values API Paint API Animation Worklet
KarstenBuckstegge's houdini-experiments Paint API
AndresCuervo's css-houdini-experiments Paint API
Hello Houdini Paint API

📺 Talks

Talk Conference | Channel Speaker
Houdini: Demystifying the Future of CSS Google I/O 2016 Surma
Houdini Task Force BlinkOn 5 2016 Ian Kilpatrick
Houdini and the Future of Web BlinkOn 6 2016
Polyfills & Houdini | Browser API Special CSS Day 2017 Phil Walton
The Future of CSS: CSS Houdini CSS Day 2017 Tab Atkins
CSS Houdini - from CSS variables to JavaScript and back NDC Conferences 2017 Serg Hospodarets
Houdini, the Future of CSS DrupalCon Vienna 2017 Chris Ruppel
Animation Worklet HTTP203 Advent Surma
CSS Houdini: From CSS Custom Properties to JavaScript Worklets and back Voxxed Days Thessaloniki 2018 Serg Hospodarets
Magic tricks with Houdini CSSConf Australia 2018 Sam Richard
Houdini the new CSS Magic JSUnconf 2018 Karsten Buckstegge
Houdini - What lies ahead JSConf Iceland 2018 Arun Michael Dsouza

📺 Video Tutorials

Video Author
Animate gradient components independently with CSS vars & Houdini magic Ana Tudor
Möbius beacons with CSS transforms, variables and Houdini magic Ana Tudor
Cube rings with CSS variables & Houdini magic Ana Tudor
Neon trails on torus with CSS variables & Houdini magic Ana Tudor
moon grid with clip-path, CSS variables & Houdini magic Ana Tudor
Rainbow bar spinner with CSS vars & Houdini magic Ana Tudor
Pointless 🌈 stairs with CSS variables & Houdini magic Ana Tudor
Temperature display change: conic-gradient, CSS vars, Houdini magic Ana Tudor

📄 Slides

🗣 People that talk about CSS Houdini

awesome-css-houdini's People

Contributors

cwervo avatar elrumordelaluz avatar nucliweb avatar

Watchers

avatar avatar avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.