Tailwind CSS home page

Showcase

Lemon Squeezy

Screenshot of the Home screen in the Lemon Squeezy app. To the left is a menu showing the different areas of the app, and to the center and right is a dashboard with charts relating to the Lemon Squeezy store being demoed here. Charts can be filtered by date. For each chart, three’s a purple line for the selected period and a pink line for the previous period. Above each chart is the current value for the shown metric and below, in grey, is the metric of the previous period. A badge next to the metric shows the percentage change in green for a positive change and red for a negative change. Hovering the chart shows the metrics at that specific time in a little card.
Technologies
Tailwind CSS, Laravel, Vue
Date
URL
www.lemonsqueezy.com
Go to website

Lemon Squeezy

An all-in-one platform for selling digital products online.

Lemon Squeezy is an all-in-one platform for software businesses, covering payments, subscriptions, tax compliance, digital downloads, licensing, email marketing, and a few other things. The Lemon Squeezy app is built using Laravel, Vue, and Tailwind CSS.

Screenshot of the login screen for the Lemon Squeezy app. The screen is split in two, 50/50. To the left is a login form and buttons to sign in with Google and Twitter. To the right is a colorful background with the familiar Lemon Squeezy color patterns of drops and circles. In the middle of the section is a testimonial from a Lemon Squeezy customer.
The login screen for the Lemon Squeezy app, with rotating testimonials on the right-hand side.
Screenshot of the Lemon Squeezy store designer. To the left is a sidebar menu with various settings for the store that can be toggled on/off. To the center and right is a live view of what the store looks like embedded in a fake browser window. There are also buttons to preview and publish changes.
The Lemon Squeezy store designer, where you configure your hosted storefront.
Screenshots of a demo store on Lemon Squeezy. At the top are a header image and store logo. Below the header are the store name and a subtitle. Below the title is an email capture with a subscribe button. Finally, there’s a 3-column grid listing the products.
An example Lemon Squeezy hosted store, with an email capture and a list of products.
Screenshot of the Home dashboard on a 375-pixel wide mobile device. The menu is collapsed and can be expanded by clicking the sandwich icon. The charts are listed in a single column on the narrow screen.
Screenshot of the Products page with a list of products on a 375-pixel wide mobile device. Products are listed in a table with basic information and revenue metrics. The table can be scrolled sideways as it doesn’t fit in the viewport.
Screenshot of a Lemon Squeezy demo store on a 375-pixel wide mobile device — the only difference between the mobile and desktop versions is that products are shown in a single column on the narrow screen.
The Lemon Squeezy app and store experience on a 375-pixel wide mobile device.
Screenshots of the Products page with a table view of products with basic information and revenue metrics. Above the table is a search field to filter the products. To the left is a sidebar menu with the Store section expanded and Products being the active page.
A table view of products in the Lemon Squeezy app, including basic sales and revenue metrics for each product.
Screenshot of the Integrations page, a subpage under Settings, in Lemon Squeezy. There’s a list of 3 apps, Mailchimp, ConvertKit, and Zapier, and the Mailchimp app is marked as “Connected.” Above the list is a horizontal menu showing the different settings pages. To the left is a sidebar menu with the Settings section expanded and Integrations being the active page.
The Integrations settings page showing a list of available apps to connect to Lemon Squeezy.