I have recently completed a number of forward-thinking Webflow templates I know you're gonna love. Think art, design, cool e-commerce, and more.
I have recently completed a number of forward thinking Webflow templates I know you're gonna love.
#1. Analogue
Analogue is a modern marketing website template for any studio or agency that wants to showcase their design work. It makes it easy to show off beautiful client work, and is simple to add pages or change content.
Learn more and preview the template here
#2. Jerry
Analogue is a modern marketing website template for any studio or agency that wants to showcase their design work. It makes it easy to show off beautiful client work, and is simple to add pages or change content.
Learn more and preview the template
#3. Jenny Mirage
Jenny Mirage is a very trendy editorial looking website that is built for photographers,videographers, graphic designers, and anyone with a visual portfolio that needs to stand out. Jenny Mirage also comes with many more sections and layout options allowing the designer to bring in and swap out various page sections to help communicate his/her story, brand communication, news, etc..
For sure Jenny Mirage is a forward feeling template that anyone can use without needing to know every detail of web design. It's also built for excellent page speed load time, which is important since this template will likely be very image heavy. It used WeP for most of the visual assets, which can be created right within Webflow for super minimal file sizes.
Learn more and preview the template here
Earlier this week Webflow announced mix blend modes are here right inside the designer. This is very cool news, it really is, and here's why you should care. From Webflow: "Now you can control how stacked element colors blend together and preview changes live with a new blending mode in the style panel — which brings the mix-blend-mode CSS property right into Webflow."
When would I use a mix-blend mode?
Blending mode's are great for controlling how an element's content blends with the content beneath it. This interesting control gives a design a lot of room for creative experimentation and has the ability to make things feel 'deeper'. You might take a layout with overlapping pieces - (think about text, images, or images on top of other images). Black and white elements overlapping areas of colour is a very common use of this because the colour of the colour element can be applied to the dark or white tones of the black and white image. If you’re familiar with Photoshop, this effect works exactly the same. Cool! Now what?
How do I use this?
Mix-blend-mode is called ‘blending’ in Webflow and can be found in the style panel under the effects section. While you hover over the different options in the blending dropdown menu, you’ll see a live preview on the canvas showing how the selected elements will be affected. The live preview can help you find the ideal blending mode without having to click through each option.
Where can I find this feature?
In the Webflow designer, the right strip contains all the element properties. You'll find everything you'll need to set and control properties for padding, margin, size, typography, effects etc.. Within the lower section of the Effects panel you'll find a tab labled BLENDING, and it's here you'll find the blend modes. There are well over a dozen modes available but I find mostly I use 3 or 4, which are Multiply, Screen, Overlay, and for especially intense blending try the Colour Dodge. Designers were able to use mix-blend-modes before this announcement but it was much less easy and quick - one would need to create custom css within an embed element and insert the mix-blend-mode styles by appling the css to the element class. Super difficult, no, but it's so much easier now thanks to this update that I believe there will be much much more designs using this technique.
What are the best practices for using Blend-Modes?
Mixing typography and graphics can look great when a little blend mode is used, and can really jazz up a layout with smart colour choices and contrast.
Adobe Colour is an easy place to start looking at colour combinations, and aside from that try simply opening up your layout design tool, mine is Figma, and try overlapping elements that are set to different blend modes to see what looks interesting to you.
Of course perhaps the best way to get more comfortable with blend-modes is to see them in action, and for that you need to be reading, keeping up with art and design blogs, great website design blogs, etc..
I personally like and stalk SiteInspire, Awwwwwards, for typography I love Fonts In Use, Typewolf, and a million other great resources for designers to keep up with what's happening in design.
Stay great