CSS3 Patterns Gallery. 
CSS3 Patterns Gallery





	Click on a pattern to expand
	Textareas are editable
	Browser support
	Submit a new one
	Github repo
	Enjoy!


	

	

	

		

	

	

	

	

	

	

	

	

	

	

	

	

	
	

	

	

	

	

	

	

	

	

	

	

	

	

		

		

	

	

	

	

	



    

    

    

    

    



Browser support
The patterns themselves should work on Firefox 3.6+, Chrome, Safari 5.1, Opera 11.10+ and IE10+.
However, implementation limitations might cause some of them to not be displayed correctly even on those browsers (for example at the time of writing, Gecko is quite buggy with radial gradients).
Also, this gallery won’t work in Firefox 3.6 and IE10, even though they support gradients, due to a JavaScript limitation.

Submission guidelines
If you have a new pattern to submit, please send a pull request. However, please bear in mind that I can't accept all submissions, sorry for that. For a pattern to be accepted, the following factors are considered (in descending order of importance):

	Does it present a new technique?
	Is the number of gradients and color stops worth the effect? The whole point of those patterns is to make page loading faster by reducing file size and HTTP requests without the unreadable gibberish that data URIs add in our stylesheets. If your pattern needs a 2KB code for example (which becomes 10KB when used in production, due to all the prefixes), then it's not very useful, except serving as a proof of concept.
	How common is the pattern?
	Does it look nice?













