I stumbled on Frontend Mentor recently and thought it looked like
a pretty straightforward, free resource for design ideas to recreate. It's not all totally free,
but a lot of it looks like it is right now. Here's a
list of 16 front-end projects
with designs that I'm starting with.
Gain access to our full library of tutorials along with expert code reviews.
Perfect for any developers who are serious about honing their skills.
Full access for less than $1 a day
Tutorials by industry experts
Peer & expert code review
Access to our GitHub repos
New videos every week
Thoughts and Notes
Points of Interest
Built with Tailwind standard colors, except the yellow. You can check out the source code to see my tailwind config theme extensions.
Copying a design is easier and more fun than creating from scratch.
Where I Deviated
I didn't bother to include the suggested font (Karla). I wasn't sure how to do it the most efficient way for just this page. WIP
Accessibility: Not sure this design was super accessible to begin with. Maybe I could have made it more accessible by tinkering with the built in colors. Not going to jump through those hoops for this example project.
All project pages use the base layout
Help me @eleventy
Use nunjucks templating and 11th data cascade
Destroy your SEO with a Title Change
May the button rise up to meet you!
Added spacing utilities that don't seem to change anything