187b8f7b23395dc80be11fa22edd0d9bb27f7473
				
			
			
		
	chuckdries.com
My personal website. Built with
- gatsby
- tailwind
- node-vibrant
- react-helmet
and a totally from-scratch masonry gallery component that I will write a blog post about some day.
I use node-vibrant in the gatsby OnCreateNode hook to pull colors from the images and store them in the gatsby node structure. I query them in the client, then assign CSS custom properties with react-helmet. In my tailwind config, I define custom colors that use those properties. This gets me classes like text-vibrant-light that change colors to vibe with the selected image
Description
				
					Languages
				
				
								
								
									TypeScript
								
								39.2%
							
						
							
								
								
									HTML
								
								23%
							
						
							
								
								
									JavaScript
								
								22%
							
						
							
								
								
									CSS
								
								9.1%
							
						
							
								
								
									SCSS
								
								6.5%
							
						
							
								
								
									Other
								
								0.2%
							
						
					