tailwind-blogr-landing Tailwind Templates

Tailwind Blogr Landing

Blogr landing page built with TailwindCSS, custom CSS, semantic HTML, and vanilla JavaScript.

Frontend Mentor - Blogr landing page solution

Blogr - Desktop Solution

Live Site URL - https://stephorc.github.io/tailwind-blogr-landing/

This is my solution to the Blogr landing page challenge on Frontend Mentor. Frontend Mentor challenges help you improve your coding skills by building realistic projects.

The challenge

Users should be able to:

  • View the optimal layout for the site depending on their device's screen size
  • See hover states for all interactive elements on the page

Built with

  • Semantic HTML5 markup
  • CSS custom properties
  • Flexbox
  • CSS Grid
  • Vanilla JavaScript
  • Mobile-first workflow
  • TailwindCSS - A utility-first CSS framework.

Features

  • Responsive sizing
  • Clean UI

Useful resources

  • LogRocket - This article helped me decide how to best import the custom project font.
  • HubSpot - HubSpot's a great site for both marketing and Frontend tips and tricks.
  • TailwindCSS Docs - Always read the docs. For example, line height is called 'leading-#' in Tailwind classes.

Top categories

Loading Svelte Themes