Tailwind CSS home page

Showcase

candycode

Screenshot of the candycode homepage hero. A large headline in the middle of the screen says, "We help alternative brands discover their voice and lean into the future." The background is a starry night sky with a mountain range showing at the bottom of the hero. The header has the candycode logo, a site menu, and a button with a wand next to the word "Start" on it.
Technologies
Tailwind CSS, Gatsby, React
Date
URL
candycode.com
Go to website

candycode

Agency specializing in imaginative websites for alternative brands.

Candycode is an alternative agency that exclusively works with alternative people and companies to build avant-garde brands and cutting-edge websites. One of the founders, Sophia Andren, also runs the Tailwind Discord community. The candycode website is a Gatsby site and uses Tailwind CSS.

Screenshot of the menu overlay when clicking the ”Start” button. To the left is a list of the different site sections; to the right is some text about candycode and a button with the text ”Say hello!” on it. There are also some icons linking to social networks and an email opt-in form.
Fullscreen menu overlay on the candycode website.
Screenshot of the homepage hero, as described above, but this image shows how text appears from behind the mountain range as you scroll the page.
Section of the candycode website where text appears from behind a mountain range as you scroll the page.
Screenshot of a carousel where each page describes a candycode project. The carousel has a thick border with a colorful gradient from red to blue. To the left are the project's name, description, and a button saying ”Explore project”. To the right is a photo of a person sitting down with a laptop in their lap.
Carousel featuring some of candycode's work.
Screenshot of the candycode homepage hero on a 375 pixel wide mobile device.
Screenshot of the Work section on a 375 pixel wide mobile device. Instead of showing projects in a carousel, they are shown as a stacked list of cards.
Screenshot of the contact form modal described below on a 375 pixel wide mobile device.
The candycode website on a 375px wide mobile device.
Screenshot of the modal that is triggered by clicking the ”Say hello” button. To the left is a quote by Steve Forbes and a button saying ”Tell me more!”. To the right is an 80s-style cassette player/radio in blue, green, purple, red, and yellow colors. Below is a heading saying ”Let´s make your future!” followed by a contact form, where only the name field is visible in this screenshot.
Clicking the ”Say hello” button at the end of the page triggers a modal with a contact form.
Footer of the candycode home page with a big blue and purple headline saying ”let's get started,” some text about candycode, and a big, white button saying ”Say hello!”. At the bottom of the page are some copyright and address information and some links to social media. In the left corner, the page is folded up, like a page in a book, and behind it, on the next page, it says ”Powered by React.”
The candycode homepage footer.