Checkerboard, striped & other background patterns with CSS3 gradients
Learn how to create checkerboard, striped, and other background patterns using CSS3 gradients without images.
Lea Verou is a web standards expert, developer, and designer with a PhD from MIT in Human-Computer Interaction. She has worked as Product Lead at Font Awesome, helped shape the web as a member of the W3C Technical Architecture Group, and has been part of the CSS Working Group since 2012. Her open-source tools like PrismJS and Color.js are used by millions of developers worldwide. Lea is also the author of a bestselling CSS book, a frequent conference speaker, and an advocate for making technology simpler, more usable, and open for everyone.
210 articles from this blog
Learn how to create checkerboard, striped, and other background patterns using CSS3 gradients without images.
Announcing rgba.php v1.2 with an improved, easier-to-use URL syntax for generating RGBA color fallbacks, now hosted on GitHub.
Analysis of different UI patterns for editing tags in applications, comparing pros and cons of various approaches used by popular platforms.
Explores the use of percentages in CSS border-radius, covering the specification, browser bugs, and practical use cases for creating circles and ellipses.
Author shares slides and CSS framework from their Front Trends 2010 talk on practical CSS3, including browser compatibility notes.
A proposal to allow CSS attr() values inside calc() functions for more dynamic styling and semantic HTML integration.
Exploring the idea of automatic login via notification emails, discussing the tradeoffs between usability and security.
Lea Verou announces her CSS3 talk at the Front-Trends 2010 conference, covering selectors, gradients, and new features.
A web developer shares insights from designing a modern university course on web development, focusing on standards and future-proof skills.
A critical analysis of using pure CSS for complex illustrations, arguing it's a misuse of the technology compared to more suitable alternatives like SVG.
Exploring advanced CSS counter techniques and demonstrating them with a CSS3 Reversi game UI implementation.
How rewriting a MySQL query to use indexes properly improved performance from 10 seconds to 0.03 seconds.
A web-based tool for testing and understanding CSS3 structural pseudo-class selectors like nth-child and nth-of-type with live element manipulation.
A technique for creating custom checkboxes and radio buttons using CSS sprites, improving on an existing method for better image control.
A demonstration of recreating the iPhone keyboard interface using only CSS3, including gradients, shadows, and custom fonts.
A JavaScript developer proposes a shorter, regex-based function for reading browser cookies, criticizing verbose mainstream solutions.
A developer explores using Unicode ligatures to shorten tweets, creating a script called 'ligatweet' and analyzing browser support for special characters.
Explores using Unicode characters like @ and ․ to hide email addresses from spambots, offering a less common alternative to traditional methods.
An experimental JavaScript approach to creating elastic textareas that auto-adjust height without hidden divs, discussing browser compatibility.
Announcing an updated version of rgba.php, a server-side script for cross-browser RGBA color support, with new features and bug fixes.