Here you’ll find a list of tools, libraries, polyfills and other kinds of open source scripts I’ve developed over the years, ordered by release date, NOT popularity. Some of them only work in recent browsers. Also, obviously if you use a tool to help you with an experimental CSS feature, it probably won’t work in browsers that don’t support that feature.



Ultra lightweight, customizable, simple autocomplete widget with zero dependencies

Contrast Ratio

Contrast Ratio is a modern tool for testing whether a combination of colors passes WCAG 2.0. It accepts any CSS color the browser accepts, including semi-transparent colors, color keywords, HSL(A) colors and the like. You can also share color combinations with others by just sharing the current URL.


Prism is a new lightweight, extensible syntax highlighter, built with modern web standards in mind. It’s a spin-off from Dabblet and is tested there daily by thousands.


An interactive CSS playground. Pretty much my most successful project so far, with thousands of visitors every day.


A CSS transitions gallery that shows what’s possible with even the most basic of transitions: one property, two values.


-prefix-free is a library that allows you to write standard, prefix-less CSS and have the necessary prefixes added on runtime. It uses feature detection for almost everything.

A tool that helps you work with the easing functions of CSS3 transitions & animations and share them with others.


A tool that helps you convert between the different CSS-accepted color formats (including name keywords) as well as share them with others.

CSS3 patterns gallery

An interactive gallery that demonstrates what’s possible with just CSS gradients. It also allows you to edit the code, to experiment with gradients yourself.


Chainvas is a tiny generic chaining library that can make any API’s methods chainable (like jQuery). Official plugins for the DOM and the Canvas API included.


A script that enables incrementing/decrementing multiple numeric values in textfields with the keyboard arrow keys.


My popular slideshow framework, built exclusively with open web technologies. Includes plugins for editable CSS regions, syntax hightlighting and more.


A server-side script that automatically generates semi-transparent PNGs to be used as fallbacks for RGBA colors.

  • Pingback: Adrian Parr's Blog » Blog Archive » HTML, CSS & JS Online Code Editors/Playgrounds()

  • Pingback: CSSquirrel : Goggles Are In | opinions and news on web design by Kyle Weems()

  • rex_mizan

    Great works!!

  • Phil

    Love your Work! Thank you!

  • You’re pretty amazing Lea. This is an awesome body of work.

  • Pingback: Adrian Parr's Blog » Blog Archive » -prefrix-free()

  • Eduard Gotwig

    Hey, might you please take a look at ? its an web based editor for presentations, realized with impress.js as library.

  • Congratulations Lea V is cool this work

  • Pingback: Site under construction » Sample Page | frank hague()

  • sd


    • df


  • Tom

    How old are you? You don’t waste time right?

    • 26. Oh I waste plenty of time 🙂 Wasting time is the best way to get new ideas 😉

      • Aklavya

        It just awesome ! ..and looking coolest all of your project…… Lea .. I Salute your work…. i really get newest idea by giving time to your website..Thanks.

      • now i am thinking to waste time more more times get new ideas….

      • I thought I was the only one doing that…best of luck

      • Danu

        woman can never pass the age 26 😛

      • Eddy

        Seeing that you are only 26 and have accomplished so much has inspired me to accomplish even more by the age of 25. Thank you for this.

      • Govind Yaswanth

        She had started her technical life from the stage, when we are still fighting with graduation.

        She started her technical life in her diploma itself

      • Are you still 26?

        • As you can see, that comment was posted over a year ago. I don’t have time-stopping superpowers 😛

        • I also saw a comment by someone say that women can never pass 26 😛 , Plus I saw your pics, you don’t look 27 at all

  • Per Rosendahl

    Awesome work!

  • HaroonAbbasi

    Amazing list of work.

  • dhiran

    Great jobs!

  • shivam chopra

    You are pretty cool…!!! you’ve done amazing work.

  • You are amazing!

  • Pingback: Wi Fi Horizon, use copoun inside()

  • 膜拜大神!

    • 王昭辉


  • Excellent Work Lea…

  • Gujaalboy

    I love you!

  • <OMG

    Amazing works Lea , youre amazing girl too.

  • Pingback: Clean and Simple CSS Patterns | The Jeremy Moss()

  • Jayme Cousins

    I bow before the brilliance!

  • Congratulations 🙂 you’re so amazing

  • Pingback: Dabblet : A project by Lea Verou()

  • Barun Bhaumik

    I want to create blog section.Can you help me.please mail me.

  • Barun Bhaumik

    You and your thinking is cool. Are you 26. But your new ideas are too excellent for me.I am a web designer and I used your tutorial for my design.Many many thanks to you.

  • Barun Bhaumik

    I am wordless to appreciate you!!! You dont know what you have created for us, the wed designers cum developers. I personally appreciate you “carry on”.

  • rewrwr


  • What inspires you to do all this!! Everyone has a stoppage but it doesnt seems in your case!

  • Pingback: Personalities that Web Developers Should Follow to Get Helpful CSS Tricks()

  • Joby Tom

    Great Works!

  • razaqnice


  • DanOwen

    Love your CSS3 Secrets slideshow. It’d be nice if you indicated Chrome compatibility.

  • Pingback: Персоналии: Lea Verou | GEEKFEMINISM.RU()

  • MockingBird

    I love your works so much, Lea!!

  • tormahirtormahiri

    مەن سەل ھەيران قالدىم
    i wondering little bit

  • Pingback: What Are You Using? | DK Studio Home()

  • Mampel

    Nice work Lea Verou!

  • Kshitiz Rimal

    your profile is inspiring, i knew about your projects but i didn’t know it was build by you. amazing collection

  • David Hc

    Dude, i love prefix-free.js 🙂 a nice work. I free from hell now :p

  • carlos

    This it my new best place, Regards lea excelents work.
    Hug from the south of world

  • Bruno Gomes

    rgba.php Makes my life so much better. Thank you for that! <3

  • Patrick Matthews

    your site certainly taught me something new today!

  • Pingback: Notthatred | Dabblet()

  • victor alfonso caballero cabre


  • Marcelo Silva

    Amazing projects!!! Hugs.

  • tomjamescn

    So Greate Job!

  • Eriky Pessoas

    I’m your fan….
    Great works

  • Massimo Ivaldi

    I am admired: you are a great artist

  • Kareem Ahmed

    i think this list needs “colorzilla” added to it they have the best CSS Gradient Generator i have ever seen on web

    • As I thought was obvious, this list is projects I’ve made. I didn’t make ColorZilla, so no it’s not missing from the list. You just misunderstood what the list is about.

      • Kareem Ahmed

        i’m very sorry for that mistake .. i must have been excited to see lots of lovely tools in one place that i thought of adding another, and forgot to read the paragraph above 🙂 .. again sorry

  • Thank for the “prefixfree.js”!!!
    But what about “filter: greyscale (%);”

  • Awesome… It looks like you have Ph.D. degree in web developing 🙂

  • Pingback: Shaping CSS | Web Design Weekly()

  • chapeau bas

  • william otto

    you’re so cool, finding this now makes me sad about leaving the world of web design,,,

  • Thank f**k I found -prefix-free

  • Pingback: AEA Notes – The Chrome Zone / Jay R. Wintermeyer()

  • Pingback: Ensure contrast between your text and your background with right colors | HolaRails()

  • Tho Vo

    Hi Lea,
    The link for corner shape is incorrect, could you please fix it?

    Thank you a lot for your hard working 🙂

  • Andelina

    It is so cool,I like it!

  • Andelina

    This is my first time have saw so cool web,I really like it! I’m from China

  • Pedro Carvalho

    Your work is admirable both as in quality and quantity. Congratulations!

  • JCinDE

    Saw your Play by Play on Pluralsight. Good stuff!

  • beagledog1

    Pretty good stuff.

  • Milad

    you are the best !!!!! im depressed now after seen your web site and portfolio !!!!

  • Hi Leo verou, I have seen your Regex video its quite good. It’s so helpful to me. And your work on css and svg bit interesting. keep it up. 🙂

  • Annie Finch

    I am looking for a woman web developer/designer–someone very skilled and professional but fun to work with. Anyone know anyone looking for work?

    • Why specifically a woman?! That’s gender discrimination.

      • Annie Finch

        Lea, if you are looking to debate on the topic of discrimination, you can do it here.
        To answer your question, here are my reasons for looking specifically for a woman:
        1. I run a woman-centered company so it seems appropriate.

        2. I enjoy working with women. When it is a good match, working together can flow delightfully and feels easier for me, generally speaking (of course there are always exceptions!) than working with men.

        3. I’d like to do my part to encourage more women in web development.

        • Discrimination is discrimination and cannot be positive. Discrimination is losing out on opportunities because of a characteristic you don’t and can’t control (e.g. gender) and it applies here just as much. “Positive discrimination” is an oxymoron. Not to mention that it hurts both genders. As a woman, if I realized I was hired somewhere instead of somebody more capable because of my gender I would be extremely pissed off.

          Also, it seems extremely hypocritical to talk about diversity and want to hire exclusively women. That’s not diversity, that’s the same kind of gender monoculture that we are trying to fight.

          If a man wrote exactly the same thing you just did, about his gender, we’d call him a sexist pig. Can you even imagine the repercussions if a man said this:
          “I run a man-centered company so it seems appropriate.
          I enjoy working with men. When it is a good match, working together can flow delightfully and feels easier for me, generally speaking (of course there are always exceptions!) than working with women.”
          What makes you different? Why should a man fight feeling like this and adapt to working with women but you don’t have to? Does being a woman give you a free pass for this sort of thing?

          Lastly, maintaining a female-only bubble doesn’t “encourage more women in web development” or in tech or anything. People outside the bubble still have the same skewed impression about women in the field. Women that depend on the bubble to thrive will still feel uncomfortable participating in the wider industry, going to conferences, meeting colleagues. It’s not a solution, it’s an ugly hack masking the problem. For true change to come, you need all genders interacting with each other, not segregation.

          If anything, this is probably illegal too, and for good reason.

        • Annie Finch

          Lea, Yes, many do feel that the historically black and historically female colleges don’t provide the most useful experience for students who will have to deal with the “real world.” But on the other hand, many students have found them EXTREMELY helpful, and without the historically women’s colleges, which educated so many important women leaders, it seems clear that women would not have gone nearly as far as we have. And there are certainly other groups in the U.S .that are only open to people of certain backgrounds–for example, there is the Cave Canem group for poets of African American descent. As a white poet, I am not allowed to teach in that conference or participate in it in any way. Technically that may be called discrimination from a narrow point of view, but I, like most people, believe it is a good thing from a broader point of view, because the conference provides a context in which people who are marginalized by the mainstream can become stronger, become more aware of their own identity without being drowned out by the mainstream, and end up doing their best work, which helps us all. I’m sure you are aware of this principle. It is generally called “affirmative action.” In the U.S., affirmative action is widespread and has proved extremely helpful in correcting social power imbalances (I see you are from Greece where the situation may be different.)

        • It’s not just about dealing with the real world from the minority group, it’s also the issue of visibility of the minority group to the outside world. I.e. to put it in simple terms, if nobody in the industry ever sees women around because they’re too busy working in their own bubbles, guess what connection they will subconsciously make about women and tech.

          Also, LOLs at you explaining what affirmative action is and even putting it in quotes as if you’re introducing some term I’ve never heard of, because you read somewhere that I’m from Greece and started making assumptions. I wonder what’s the xenophobia-related equivalent of mansplaining?

          Btw, I don’t even live in Greece anymore, but that shouldn’t matter.
          I’d recommend a bit more travelling abroad, to realize that other countries are not as primitive as you have been brainwashed to think (and often are more developed than the US). Especially when it comes to gender equality, (Nothern) Europe is centuries ahead of the US.

        • Annie Finch

          Good point about visibility. I completely agree. At best, “strategic essentialism,” to use Gayatri Spivak’s useful term, should focus as a power-enhancing launch pad into the wider world, not as an isolating bubble.
          Actually I have travelled the world quite a bit compared to most Americans. And I’ve taught and administered people from many parts of the world. One thing I’ve noticed is that the unique history of race relations in the “lower 48” states of the US–the influx of huge numbers of enslaved people at the very founding moment of the nation– has created a very particular climate which can be quite difficult for people from elsewhere–even from Hawaii and Alaska–to understand. These race relations and the best practices for engaging with them bear, to my mind, many similarities–both haunting and useful similarities -to relations between the genders. And affirmative action is no exception.

        • Annie Finch

          PS This video may be helpful–it addresses your more general question and clarifies how it is not simply a matter of reversing exactly what I wrote. Where the comedian says “reverse racism,” you can just replace it with the phrase “reverse sexism’; for his examples, just substitute examples from women’s experiences over the centuries. Best, Annie

  • ManiManishah

    Awesome Work (y)

  • Pingback: Lea Verou - ByPeople()

  • piratehouse
  • Pingback: Take your daughters (and sons) to see ‘Interstellar’ | Reel Girl()

  • César Gómez

    You’re a great inspiration Lea, Cheers!

  • Vince

    Shouldn’t dpiLovebe ppiLove, since dpi stands for “dots per inch”, used for print?

  • Robert Lozyniak

    What I don’t understand is why some people have such a hard time wrapping their brains around the fact that, yes, some women do in fact write computer programs.

  • Mark van Elswyk

    Hello Lea, wondering if you can assist with a program. (I’m willing to pay for your work) The details are as below:
    I’m after a Cubic Bezier Generator that will generate random outputs to feed into a 3D Horse game.

    This needs to run in a web browser so it can work on a windows / apple computer.

    So here is an an example of what a Cubic Bezier Generator looks like:

    The output file will need to have the following with up to 14 lines (For 14 Horses)


    0.96, 0.27, 0.07, 0.77, Linear (Random, in a positive direction, & Random style)

    0.94, 0.52, 0.09, 0.45, Ease (Random, in a positive direction, & Random style)

    etc, up to 14 in total

    1.) The Transition-duration will need to be adjustable from 1 second to 5 min

    2.) I would like to have all 14 plots on the screen as well as a quick visible check.

    Let me Know what you think, Thanks


  • Pingback: 11 risorse che ogni developer dovrebbe seguire | Pane&Design Lab()

  • my absolute hero. please pleseplease rise voice about the css column support. i thingk its an extremly useful feature but the support has been poor for years now. i thihk its a forgoten ground, a dark room. please bring some light to it.

  • Eric Jose

    I am browsing your website over lunch (it is keeping me interested and awake). I am wondering about 2 things.

    Firstly, how come there is no typo or grammer error in any of your technical documentation or here in the website. How do you proofread amidst all the work and life? :)) I bet you could find typos and grammatical errors in my comment.

    Secondly, What’s the secret to your energy?

    Wish I was in the same world as MIT is, so I could remotely stand a chance of knowing you.



  • Pingback: 9.34 – Border Radius | Alvarez()

  • jenner.luo


  • Pingback: agumonkey comments on “Easing Functions” | Exploding Ads()

  • Adil_Rehman

    Awesome ….. you got talent.

  • mor789

    You’re website is not responsive

  • Justin

    You stretchy link points to spot the unsubscribe link.

  • Seriously a big list of open source, hope I could have reached those numbers. Well congratulations.

  • Sk. Imtiaz Ahmed

    You’re an inspiration! Your 10-secrets video literally got me into CSS, thank you for that. 🙂

  • Dhananjaya Karandana

    I learned a lot more than I expected; keep it up your good work Lea


    nice showcase of design !!!

  • Benson Cai

    These projects is so amazing! — From the distant

  • Pingback: nike nfl jerseys china()

  • David GKP Oster

    My congrats for your efforts!!! Keep up the excellent work.
    Quick question: Is there, to your knowledge, a cross browser technique where you could create a transparent border that is gradient and starts from the outside with darker color and collapses to the center with less darker color, from both sides at the same time?

    Σε ευχαριστώ πολύ!

  • Pingback: backlink building service reviews()

  • Pingback: Google()

  • Pingback: tower gardening ideas()

  • Pingback: Piece Of Heaven()

  • Pingback: viagra()

  • Pingback: cats()

  • Pingback: MATKA RESULT()

  • Pingback: LTN()

  • Pingback: Software()

  • Pingback: sex()

  • Pingback: 福井脱毛()

  • Pingback: 福井脱毛()

  • Pingback: cheap soundcloud promotion()

  • Pingback: work to home()

  • Pingback: Taxi Airport Zurich St. Anton()

  • Pingback: 강남야구장()

  • Pingback: receive sms online virtual number()

  • Pingback: Jaydani()

  • Pingback: BSM35GD120DN2()

  • Pingback: life insurance lawyer()

  • Pingback: android tv box setup()

  • Pingback: Kinky Boots tickets()

  • Pingback: Online advertising()

  • Pingback: best work from home jobs sites()

  • Pingback: downtown tampa magazine()

  • Pingback: افلام جديدة()

  • Pingback: wholesale oakley sunglasses()

  • Pingback: brightest flashlight()

  • Pingback: online virtual card buy()

  • Pingback: free virtual number for texting()

  • Pingback: matka()

  • Pingback: Spezialturen()

  • Pingback: shatter()

  • Pingback: pure kona coffee()

  • Pingback: cours de guitare()

  • Pingback: web design in pittsburgh()

  • Pingback: gourmet hawaiian coffee()

  • Pingback: gourmet hawaiian coffee()

  • Pingback: gourmet hawaiian coffee()

  • Pingback: gourmet hawaiian coffee()

  • Pingback: buy the worlds best gourmet coffee beans online today()

  • Pingback: gourmet hawaiian coffee()

  • Pingback: custom paint()

  • Pingback: Home Security()

  • Pingback: how to make an app()

  • Pingback: porn()

  • Pingback: computer()

  • Pingback: Home Security()

  • Pingback: awiz for love()

  • Pingback:

  • Pingback: read more()

  • Pingback:

  • Pingback: How To Determine the Sex of a Beaver()

  • Pingback: how to make money()

  • Pingback: penny auction guide()


  • Pingback:

  • Pingback: luxury chalets()

  • Pingback: how to make quick money()

  • Pingback: Bridal()

  • Pingback: регистрация ооо Киев()

  • Pingback:

  • Pingback: vigra()

  • Pingback: black magic for love()

  • Pingback: Google()

  • Pingback: home decor()

  • Pingback: kala jadoo()

  • Pingback: Cheap Banners()

  • Pingback: london()

  • Pingback: satta matka()

  • Pingback: read this post here()

  • Pingback: woodworking()

  • Pingback: Play games online()

  • Pingback: Free Games()

  • Pingback: fonte IMP()

  • Pingback: Click here for more information()

  • Pingback: tactical military boots()

  • Pingback: cracked smartphone()

  • Pingback: SEO services in Lahore()

  • Pingback: Convert here for free()

  • Pingback: piano lessons in atlanta()

  • Pingback: youtube to mp3 online()

  • Pingback: how to create your own app()

  • Pingback: SEO services in Lahore()

  • Pingback: Download PC Games()

  • Pingback: Free Games download()

  • Pingback: Divorce Law Firm for Men()

  • Pingback: kostenlos book of ra spielen()

  • Pingback: satta matka()

  • Pingback:

  • Pingback: legal will()

  • Pingback: rock building materials()

  • Pingback: retirement benefits cut by congress()

  • Pingback: light deprivation greenhouse()

  • Pingback: More Information()

  • Pingback: atlantapiano- Piano lessons in the Atlanta Area()

  • Pingback: Pinganillos()

  • Pingback: omaha computer repair()

  • Pingback: trechos de filmes para retrospectiva()

  • Pingback: SEO services in Lahore()

  • Pingback: Textildruck()

  • Pingback: personalised fans()

  • Pingback: drink coaster()

  • Pingback: JUAL Pompa Air Tenaga Surya paket lengkap LORENTZ()

  • Pingback: Denver office space for lease()

  • Pingback: 受注管理システム()

  • Pingback: Cash for car melbourne()

  • Pingback: best marketing automation software()

  • Pingback: Family Court()

  • Pingback: Turen()

  • Pingback: Fenster()

  • Pingback: SATTA MATKA()