Tailwind CSS home page

Showcase

Shopify

Screenshot of the Shopify website hero. It contains a navbar with the Shopify logo, some menu items, and buttons to log in or start a free trial. The hero is split in two columns. To the right is a photo collage of people in different types of stores and screenshots of various parts of the Shopify product. To the left is a main headline. Above it is a button to watch a video about Shopify. Below is a subheadline and email form to start a free trial.
Technologies
React, Tailwind CSS
Date
URL
www.shopify.com
Go to website

Shopify

The all-new Shopify.com website.

With over 2 million vendors on their platform, Shopify is one of the world’s largest and most popular ecommerce solutions. The Shopify team recently redesigned their marketing website using React and Tailwind CSS.

Screenshot of a feature section on the Shopify website showing different ways to buy on Shopify. There’s a headline with an all-caps eyebrow text above. To the right of the headline are a short description and a call to action to start selling. Below are three photos of people buying on Shopify via a website, a smartphone, and using Apple Pay in real life.
Feature section showcasing different buying experiences on Shopify.
Screenshot of a call-to-action section on the Shopify website with a headline, a subheadline, and a button to start a trial. The text is black on a green gradient background. The button is black and pill-shaped with white text.
Simple call-to-action section with black text on a green gradient background.
Screenshot of a feature section with a carousel showing the Shopify store builder. Each element is an animated gif; below the gif are three columns with descriptions, one for each feature. Above each description is an animated progress bar indicating when the next element is coming into view.
Feature section with a carousel showing three parts of the Shopify store builder. The line above each section is an animated progress bar indicating when the next carousel element comes into view. Each element in the carousel is an animated gif.
Screenshot of the Shopify website hero on a 375-pixel width mobile device. The hero is essentially the desktop version without the photo collage.
Screenshot of a section of the Shopify website on a 375-pixel width mobile device with a four-column row of links to different parts of the Shopify website. On mobile, the row is scrollable horizontally and functions as a carousel.
Screenshot of the Shopify site navigation on a 375-pixel width mobile device. The navbar takes over the entire screen below the navbar and has a sticky section at the button with buttons to log in and start a free trial. Each section in the navbar expands to show subsections.
The Shopify website experience on a 375-pixel width mobile device.
Screenshot of a pricing table on the Shopify website with three tiers. One tier is highlighted as “Most Popular” with a darker background color and a border.
Pricing table with three tiers.
Screenshot of a feature comparison table on the Shopify pricing page where each pricing plan is compared feature by feature.
Feature comparison table with detailed information for each pricing plan.
Screenshot of the website footer on the Shopify website. The main area of the footer contains a Shopify logo and many links to different parts of the Shopify website and ecosystem. At the bottom are a country picker, links to the terms of service and privacy policy, and social icons for various social media platforms.
The website footer on the Shopify website.