How to achieve the greatest output having at hand only a range of typography and some primitive graphical elements such as lines, ribbons or stars? Designers that have managed to make our list with their matchless work know the answer to this tricky question; and as it turns out, it is hidden in the concept of combination supported by concordance and chime that lets you create amazing eye-catching elements from a limited number of instruments. The notion is closely linked to an acute sense of styling and harmony; it is a truly powerful and important skill that is transformed into a real art when it comes to website design.
Today we are going to examine first-rate products of mixing and matching: projects that are marked by marvelous banner-like and badge-style components including logotypes, skillfully-executed taglines and simple figured centerpieces that reinforce the decorative side of the interface design.
Banner Badge Styles in Web Design
Festival des Batisseurs
Here the constructing atmosphere immediately becomes evident not only due to a video background but also thanks to a vibrant emblem that corresponds to the theme with its silhouettes of workers, an appropriate coloring and rough typography with a geometric vibe.
Café com Arte
The website has a pleasant “lovey-dovey” appearance thanks to lots of ornamental elements such as vibrant backdrops with a floral pattern, curly frames and logotype with a beautiful script typography. The latter naturally blends into the composition.
Ride for the Brand
The website aesthetics are based on numerous incredible badge-style graphics made in a classy black and white coloring that all together produce a powerful impression diluted with a charming retro appeal.
Heck House
Much like the previous example, here monochromatic coloring effectively stresses the decorative bold type-based tagline placed in the center as well as bringing it into the spotlight. The element looks neat, restrained with some nice retro zest.
Twin Pine Journey
The landing page of the website is marked by an amazing vintage style badge that characterizes the project. It is made in earthy colors and has lovely grunge touches that enrich the overall atmosphere adding its own feeling of old-timey road adventures.
Mitchel Wassler
Mitchel Wassler has prettified the homepage of his online portfolio with a staggering vector badge-style piece that aims to briefly introduce the artist to the online audience. The component is composed of ribbons and coloring that laconically echo the logotype and main color scheme.
Benjamin Marc
Benjamin Marc goes for a more clean and minimal approach, having proved that less is more. The logotype definitely strikes the eye with its subtle and refined execution that despite being based on ultra-thin graphics effectively stands out from the backdrop.
The Barrelhouse Flat
The website boasts a magnificent range of ornamental typefaces that overfill the whole front page, but not overwhelm visitors. There are lots of elements and modules that have a clean badge-like appearance with an adorable vintage vibe.
Shoshorov
This first-rate online portfolio naturally reflects the creative personality of the artist, who opts for a retro style that is skillfully spiced up with some sumptuous steampunk-inspired illustrations. Here, every component and every graphical element contributes to the design aesthetics.
Jack Daniels
Jack Daniels Bars is an enigmatic promotional website that draws you in. The first thing that strikes the eye is the top-notch chalk-style rough title that featuresa highly decorative element and matching retro type.
Scotch and Soda
The official website of the brand features some brilliant sketchy elements that act as navigation. Here the central and the most viewed part is reserved for an animated hand-drawn banner-style logotype that ties everything together and gives the front page a finished look.
SoCal Sydney
SoCal Sydney looks strange yet visually-appealing and memorable. The vibrant design is supplemented by clean chalk-style graphics; the embellishment placed in the heart of the “welcome” section effectively lures you to explore the project further.
Long Story Short
The hero area is brightened by a gorgeous, elegant, type-based centerpiece with lovely swirls that add to the dark design a keen sense of refinement and sophistication. The darkened image background serves as a foil to this highly decorative piece.
Fineshmaker
Here the designer adapts a similar approach: there is also a dark video background that naturally singles out the badge-style title painted in white. A ribbon and stars in the centerpiece enormously enhance the appearance.
The Maine Thing Quarterly
Here each category is bolstered not only by a striking photo backdrop but also by a charming title that is composed from text and complementary graphics. The front page looks sleek and subtle.
Riley’s Cycles
Riley’s Cycles is marked by a brutal rough banner-style logotype that features an excellent combination of elegant cursive typography with a grunge feeling and some matching graphics. The logo represents a style that permeates all sections on the home page.
The Barstow
The Barstow is a perfect example of how you should combine together an elegant hand-written typeface and a retro rough 3d font. Graphical elements such as arrows, gears, banner-like pieces not only add a charm but also tie these fonts together forming a magnificent centerpiece.
Knuckles Industries
The website vividly showcases how to creatively and briefly introduce the company to the visitors implementing only some eye-catching fonts and several tiny ornamental elements. The composition takes up the right-hand part and immediately grabs attention.
Logan’s Roadhouse
With such a delicious image background, it is quite difficult to draw users’ attention and direct it to the required information, however the artist has managed to succeed by creating a banner-like centerpiece with a title that strikes the eye.
NYC FC Badge of Badges
A website with such a name just could not but help to bear in its interface design several characteristic badge style components. Thus, the front page is enlivened by a beautiful clean vector with an urban feeling.
Conclusion
Sometimes, the success of building a great website design lies in your skills of mixing and matching rather than in the possession of a diversity of tools. The above examples prove this: simple, well-balanced, proportional and perfectly-formatted badge-style elements can easily turn an unremarkable design into a visually-appealing project.