8 DARK MODE Websites to Copy in 2023

In this video I'm walking you through my Eight favorite Dark theme websites Starting with experience welcome.com I Love this website for a number of Different reasons but the first reason Is the big bold font right here at the Top it's a really short header Captivate And convert and it draws my attention Right away now as I scroll I really love These images and videos and assets that They have on the website you can see That as I scroll down this video pops up Off of the laptop and then it's right There front and center giving me a demo Of everything that they do now the other Thing that you're going to notice is a Common theme throughout all of these Websites is the different ways that you Can add depth to a dark Theme website Sometimes it feels like everything just Has to be black in the background but Bringing in some different colors Whether that's an orangish pink a deep Blue using some type of gradient or box Shadow really makes things pop and makes It not feel like an old-fashioned black And white TV show now I do really like That this background has a little bit of Noise to it something that you can do Pretty easily that adds some texture to Your website I also love the different Scroll animations like here with the Logos where they're going to scroll up And disappear right underneath the video

Now they do switch to a white background Momentarily But I really like the way that they've Done this they still have these big bold Headers and then they're using a grid Variation to highlight different Features and things that they do and Offer now as I continue to scroll down We're going to hop back to this dark Background and again sticking with the Really bold fonts I love when websites Do this especially with a black Background because sometimes it can feel Overwhelming when everything's too small And it doesn't pop and so using these Bright whites as fonts and making them Really large it immediately draws your Attention and it's a lot easier to play With the user or the site visitor and Show them exactly what you want them to Look at continue to scroll we are Utilizing this noisy gradient here in The wording which I really really like And then we are back to a little bit of Scroll movement and animations in these Grid sections and the last section that I wanted to break down for you guys that I really love is these three steps as You hover it's going to kind of make These pill shapes blow up and so you can Get a better view of the image inside of It and as you hover it's going to change The color of the header so overall Experience welcome.com is a fantastic

Website for me this one's going to get An 8.5 out of 10. great website go look Through it you can catch a link down in The description now the second website That I want to talk about is cellx.com I Love this website and right off the bat The thing that catches my attention is The unique layout of the hero section They've got kind of this Left Right Column looks like this one on the left Takes up about two-thirds and then the One on the right takes up one third but What they did that's unique is they Center aligned everything inside of These columns and this isn't something That I would recommend doing unless you Do it with purpose and are very specific About the way that it's done but I also Love the really large font here for the Header and they change the color and the Font for the most important words which Again just draw your attention to what You want them to read most now they've Got some really great social proof here In logos at the bottom and then they've Also got some data points here on the Right that just validate what it is that They're offering now I love this scroll Animation where the words turn white as You scroll and then I also love the way They've switched up the alignment rather Than having everything left aligned They've pushed different elements over To the right while still being left

Aligned which is a really cool fun way Just to keep the user bouncing back and Forth and keep them engaged Now again they're utilizing this subtle Color change and font change inside the Headers and then the one thing that I Really really appreciate is the way that They've done this tab section now this Is something that can be difficult to Highlight or demonstrate whether it's an App or some sort of product because There's just a lot of information There's a lot of different screenshots And so using this type of tab element is A great way to get a lot done in a very Short amount of space and so you can see That these tabs open up a sub header or A subtext here and then it's changing The screenshot over on the right Now continuing down again big and bold Testimonial sections and then we've got A lot of just left right sections here And then we're down to the call to Action which again they're changing the Font and the font color of the most Important words and then they've got Their call to action here so celex Fantastic website it is a flat black Website there's not a lot of color in it But I still think it's very engaging Overall this is going to get from me a 7.5 out of 10. all right our next Website is fortnite dot studio and again Right off the bat you're going to tell

That this is not an all black website in Fact there's almost no black in this Entire website they've got kind of this Bluish purple dark background and I Think it really helps the brand colors Pop they've got kind of this peach pink Color and they're utilizing this on all The call to actions throughout the site As well as some other elements that I Think they do really Tastefully now the First thing that I want to highlight on This is I love that these individual Words inside of the header are buttons And they've got the little arrow here to Show that and as you hover them they Turn white while the rest of the words Get a little bit more opaque so it just Allows you to to see hey this is a Button you can click through to these Individual Services or you can go to the About section Now as we scroll down they've got just a Really standard clean hover effect here For the different individual projects And then I love how they utilize this Really bright brand color for this div Block and then have the white text and White logos on top of it this is one Thing that I really encourage you to do Is not be so committed to the dark mode Theme that you're afraid to bring in Some bright colors whether that's some White backgrounds or some colored Backgrounds if it's done Tastefully it

Can just bring so much life and Character to your website and they do a Really great job of that whether it's Individual elements right here that are Moving around just your calls to action Little icons but overall I think Fortnite dot Studio does a fantastic job Of this and again I'll put the link down In the bio this website for me is going To get a 7 out of 10 really fantastic Job and it's great inspiration for an Agency or a portfolio site so be sure to Check it out the next website is try Iboost.com and this is very different Than the other websites that I have in This video and the reason being is Oftentimes these dark mode websites make You feel like hey it has to be really You know serious and really professional But try boost.com said no we're not Going to do that we're going to use our Bright colors we're going to make it Messy and crazy and fun and I I really Love what they've done here the first Thing you're gonna notice is all the Images and they have a lot of elements That look like stickers and their design Styles it looks like somebody took a Handful of these images and just threw Them across a desk and they just placed Them wherever they landed and it feels Like really Controlled Chaos and it's Really really fun now I love how they Use the bright colors and the headers as

Well as the calls to action and then You're going to see these colors Throughout in these sticker elements That again have a little bit of a scroll Movement so everything doesn't feel too Static and then they've just got these Really bright images now the one thing That I don't agree with on this this Website is I don't like that they have The word boost in the background it does Make it feel just really cluttered and Really messy but the one thing they do To kind of counteract this what I would Call a mistake is they're using really Really bright colors to make everything Else pop and come to the front so you Don't get too overwhelmed but I would Definitely lean to the sight of making The background one solid color and I Think that would help a lot with this Website now going down again just bright Colors everywhere it just feels super Fun and then they're utilizing this Purple color and their footer again Sometimes a solid color background can Go a long ways so overall tryboost.com Gets a 6.5 for me great inspiration if You're looking to bring in some color to A dark Theme website alright so the next Website is hubble.net and I love this Website for several reasons but the Number one reason is it's a dark mode Website without any black in it you can See that everything is A variation of

Either purple or blue and it just makes It feel brighter and more friendly while Still getting the benefits of that dark Mode or dark theme now you can see that All the call to actions and the little Banner up here at the top I'll use that Purple color but as we scroll down You're going to see it incorporate some Additional colors whether that's Reds Blues oranges I do love this card Section how as you're scrolling one card Overlaps the other one and then they're Bringing in some additional colors like Greens and then they've got some very Basic Left Right layouts but they have Awesome animated images with a lot of Color that just make it pop now as we Scroll down there's not really anything That's that unique aside from what we Saw up above I do love this sliding tab Section that changes the content and the Images and as we continue to scroll You're going to see a moving review Section and as you hover over this it Stops you can read the individual Testimonials and then we've got our call To action section so how double awesome Website great use of purples and blues Very good job of not just sticking to That standard black look but overall This website's going to get a 7 out of 10 for me really awesome job the next Website is sightbox.co this is big and Bold a lot of really big large all caps

Fonts I love the background video inside Their logo and as you scroll that's Going to open up to another really bold Font here that takes up most of the Screen now as we scroll down I really Like this section where you hover over It and it's going to take the icon in The middle move it to the top corner and Then show you some additional text in The center and of course all of these Are buttons and then as we scroll down They've got a really cool tab section Which again is just allowing you to show A ton of content inside a very small Space and I really do love the font and The all caps look again it just does a Great job of drawing your attention Especially because the font is that Really bright white color Scrolling down they've got some cool Scroll animations where the middle Images are moving One Direction and the Left and right images are moving another Direction And then as we come down we've got some Other additional cool hover features Where as you hover over these blog Articles it's going to show you the Image and a summary And then as we go all the way down to The bottom we've got some different like Layout variations but for the most part It's pretty standard and then we've got Our call to action at the bottom so

Sidebox is a really great kind of boxy Um static looking site but overall Fantastic job of utilizing the dark mode The one thing I do like is they used a Slight like black variation so it's a Little bit more gray I would say if you Can help it never just go a flat black Color or a straight black color what you Want to do is use different variations Of Grays Blues purples greens just to Give it a little bit more character Alright the next website is paddle.com I Feel like this is probably the most Basic dark mode website that we have on This list but they do a really fantastic Job of just sticking to the basics Really standard layouts whether that's a Three column section different icon Layouts they are utilizing a little Color inside the div blocks as Background colors this does help Different elements pop and the other Thing that you'll notice down here at The bottom is they utilize that for a Hover effect where the background Changes and the fonts change from white To black so again a really standard site I love what they've done with the images And bringing in some color utilizing These background colors whether that's Whites or lighter colors just makes it Pop but paddle.com is a really great Example of a website that you could Design pretty quickly that is a great

Example of a dark Theme website and Finally my favorite website on this list This is a site that's been talked a lot About on Twitter there are other videos Out there on YouTube about this and for Good reason this is linear dot app and In a lot of ways this has kind of set The standard for dark mode websites in Recent months and you'll notice that I've actually taken a lot of inspiration From the site especially when it comes To utilizing these different colors like Purples and blues as drop Shadows or box Shadows and different features that make It look like there's a colored light Coming onto the background of your Website so as we scroll you're going to See that the layouts are really standard But they have different ways to break up The individual sections like this looks Like some sort of planet and then you've Got this blue stars in the background And as we scroll down they've got this Grid variation with some images that are Animated but they're not moving too much Or too quickly but it does bring the Site to life and these are the sections That I love so much now these little Lines here as you scroll down they're Going to to go wider and then the light Is going to come through that line and Honestly I don't know how they did this Effect it would probably take me a very Long time to learn how to do this or

Figure out how to do this inside webflow But I love that when you get to this Section the light shines over the Section and it just brings the whole Thing to life and it really draws your Attention to whatever it is that you're Looking at at that moment now as we Scroll down you're going to see that They do this with other colors it goes From purple to this blue color and they Try to kind of match those different Colors inside the section with their Images now this one is a little bit more Of kind of like a greenish blue And then as we scroll down it's going to Bring it back to purple now I really Like how most of the things are Center Aligned sometimes we get away from Center aligning things but if it's done Well it can actually look really really Nice and it just makes it flow right Down the center of the page and for me It's a lot more enjoyable to read than Just having everything left aligned Now as we scroll down they're bringing In some other colorful images and in This website I would highly recommend Going to the site and flipping through All of the different pages for example If I go over here to the features Pages There's a lot of movement a lot of Additional colors that they bring in Whether it's yellows greens pinks Oranges this is an incredible website so

I'm going to drop the links to all of These websites down in the description But if you enjoyed this video if there Are any of these sites that inspired you To go and design and develop your own Dark theme websites please be sure to Hit that like button and if there are Any websites that I'm forgetting about Drop them in the comments down below Thanks so much for watching and we look Forward to catching y'all in the next Video

Ace The Funnel Builder
Curated by

Namaste~ My name is Ace and I found these contents SUPA~ Valuable! I apologize for the quality of the transcript... (In case you are curious I used YT EVO plugin to automatically pull these amazing contents) Enjoy!

Get Lifetime Access To Our Entire Library Of Funnel And Design Templates

For A Low One-Time Price – All Your Marketing Sorted, Forever!