Showcase of Cartoon Style Web Designs
By Peteris Kelle
Do you remember yourself as a kid watching cartoons all the time — even when parents didn’t allow you to? Most of us have watched cartoons and even now, as we get older, cartoons don’t lose popularity. Basically, cartoons are animated illustrations that are mainly designed for kids but which some adults also enjoy watching. Cartoons can be drawn by hand or they can be drawn on digital devices, too.
Web design is a creative art and that’s why cartoon elements can also be used for web design. Actually, a whole website can look like a cartoon. It’s an excellent method to help make your website look more friendly and cheerful. We have pulled together here a few websites which will hopefully be a source of inspiration for your own future cartoon style website!
Showcase of Cartoon Style Web Designs
Inspiredology website has a well-made cartoon header background that draws immediate attention to the central point of the site content. The website’s dark background is seemingly brightened by the energy of the cartoon. A gradient effect is used in many places, but the whole design of the website looks neat and finished.
Attack Of The Web
Attack of the Web is a simple website with a simple layout and the action cartoon illustration in the middle of the page portrays a precise personality description of this website owner. The website integrates a light-to-use scroll-down navigation system.
Joseph Payton’s website has introduced cartoon illustration for web on a new level by using some easy tricks and creating a feeling of the third dimension. The large cartoon portrait of a designer and the clean user-friendly page layout creates a wholesome effect. Various types of Photoshop brushes are used to bring to life the design of this page and make it feel fresh.
Traditional black and white color selection never gets old, especially when the main attention is drawn to world renown film characters. Dark color interaction with earth colors creates a simple yet sophisticated look for this website. Well defined information and bold illustrations makes it easy to get absorbed in this website.
While grid texture effect in web design is nothing new, what’s refreshing in the Cog’aoke website is the use of the grid texture set behind a bold and bright cartoon illustration. This dynamic illustration on the left side is counter-posed to colorful photographs on the right side making for an interesting composition.
While many designers may think that this cartoon illustration of the designer might be walloping and takes up too much space on the page, with this character, David Hellmann actually points out quite well the importance of the interaction between a designer and his/her clients. Taming it a little, the matte color combination of a calming blue and a steadfast brown makes for a slightly more corporate feel of the webpage.
Super Landing Page
Super Landing Page’s website is very much linear-based. Designed using a vivid yellow background together with Superman cartoon, the website delivers the first impression of excitement and power. What is then simplicity in coding is also generous in colors.
The BirdBoxx website (or rather “coming soon” page) is simple and aesthetic. A pastel color palette creates a comfy feeling with a detailed illustration of a bird sitting in a tiny house.
Natrashka website has all the elements of a scrapbook-like page. Handwritten font in combination with Arial font creates a modern look. Collage-type cartoon illustrations give the impression that all elements were taken from different places and combined in one sporadic design. The pale blue monotone color palette is broken up by dark grey contour lines. The design then actually looks fresh and well composed.
With the bright color combination of lime green and baby blue, the Somos La Pera Limonera website stands for green design. Their Eco beliefs are illustrated well via a beautifully-drawn cartoon of people watering a tree. At first the design of this website looks quite simple, but it filled with symbolism. The tree represents their web design company and the fruits are the results of their work. The vertical navigation is easy to use and every sub-page opens in a pop-up window with some interesting horizontal and vertical scrolling interaction.
Miki Mottes’ website prefers to speak completely through cartoon illustrations rather than words. As an animator and illustrator, Miki Mottes has created a truly impressive amount of illustrative works that are used in combination with various cartoon-style Flash animations. Additional sound effects certainly give the impression that this website is alive and you are right there in it!
A vibrant orange background and a collection of illustrations in the header demands your attention straight away on the Stickermule website. The monochromatic color scheme affords a modern look and feel and the light modular navigation makes it very user-friendly.
Octonauts website combines traditional design rules, such as centric composition and symmetry, with modern elements. A navy-blue patterned image repeated along the X and Y axes creates a stylish website background. The Flash animated cartoon illustration in the centre brings a fresh breeze from the ocean underworld into the design.
GetMeFast website, through using cartoon illustrations, creates a fun and adventurous feel about the page. The simple design makes it possible to present more information without frustration. The page content is well structured with borders and icons.
This website may not be as flashy or inspirational as is expected from a cartoon website, but its pleasant pastel color palette certainly creates a calming space. This is a user-friendly website with a portfolio slideshow that provides the main information needed. The various block-serif font sizes also makes this website more cartoon-inspired in look and feel.
Dishing up a cartoon illustration of a child eating fast food, the Fatburgr website pays regard to importance of obesity problems. Although the site content might be a “heavy” read, the simple and airy design with light blue and white gradient background creates a good balance in the website. A comic style font creates a fun and playful atmosphere.
Fine cartoon illustrations and flash animations is what this game website uses to attract new players – first, let them get to know the game characters and then new members will join. One click on the game characters in this site and you are able to hear some pretty cool sound effects. The illustrated scene of houses, trees and sea in the background creates a vastness of space.
The dark blue background and mixture of different Photoshop brushes here creates a modern and eye catching website. Two cartoon illustrated giraffes symbolize the Hutchouse logo. According to four categories – “Space”, “Jungle”, “Night” and “Depth” (found in the upper right-hand corner of the website) – the website design changes its appearance. The image slideshow provides easy navigation of latest information.
Bright colors, rounded corners, sassy font style and cartoon illustrations of different types of girls – these are the methods employed by Francie Pants website to show that it is a site meant for females. Simple, but sophisticated design.
Designzillas website has multiple textures including rough leather, concrete and claw scratches to break-up the dark background of the website. Bright green, yellow and orange create a good combination of colors for highlight. Rollover images are well-suited for small-scale presentations to show some valid information.
Vedin Kids website is reminiscent of a handmade board where drawings and different information have been stuck with scotch tape. A pastel color palette and small illustrations sketched by children fosters this positive and calm online presence that children can inspire. Vertical navigation at the left and right is created like a note paper and highlighted with pale pink and blue – which is a rather good design tool to draw attention out from the mostly wash-brown background.
Two cows sitting and playing cards – this is a scene that we don’t see everyday, but Knowtebook website has an explanation for this cartoon illustration. The illustrated scene depicts everything this blog is about – communication, freedom of ideas, positive attitude and learning opportunities.
Happy Webbies website takes the next step in using cartoon icons as essential communication tools by bringing them into the middle of the page and letting them speak for themselves. A simple page layout and white background is well suited for the colorful ‘T-Shirt’ icons.
Made By Guerrilla
Roughly made cartoon illustrations and additional smudges is what gives the Made By Guerrilla website a unique look. Traditional centric composition of the page layout is exaggerated by a cartoon illustrated gorilla that is staring right at you. The website has the nice added design feature – to help the gorilla stand out on first landing – whereby only upon hovering with the mouse over the navigation images are they highlighted.
Jihane Amal website has managed to create a both flawless and simple design. Even if we don’t know this foreign language, a cartoon illustration of a toddler, baby blue background and rounded corners assures you that this website is connected with children. The animation that is playing in an infinite loop adds a nice accent in the design. Bright green grass in the foreground of the website’s content creates the feeling that content is further behind the ground.
Gotta Get To Fowa
This very straight forward blog page layout is seriously brightened by three cartoon illustrated characters that give the impression of movement and action.
Solid grey background, a contrasting cartoon illustration of an owl in a military outfit and a simple font style points out clearly to users that web design is supposed to be clear and straight forward – just like in the military.
Cute Little Factory
Cute Little Factory is a website of icon designer and illustrator, Andrea Austini. He has successfully added some cartoon illustrations in the header giving us immediately a glimpse of his skills and style. An eye catching and bright design.
With cartoon illustrated candies, waffles and gift boxes around different houses, Crown website takes you immediately to a small town of entertainment. Flash animations are used in appreciable amount. Even such tiny animations as traffic light changes have been considered. Very detailed cartoon illustration with tooltips. For some however, the bright color palette and sound effects could make for confusion.
This Il Frutteto website may look simple and ordinary, but it has successfully incorporated the logo into the general structure of the page layout. A clean country side view and a bright red apple, that also symbolizes a sun, creates a perfectly centered composition. The simplicity of the design ensures that the large illustrated logo provides clear general information.
Best Mortgage Deals
Though Best Mortgage Deals is a company that presents the daily lowest UK mortgage rates, the sunny cartoon illustration depicting British country side exemplifies how even ‘boring’ business can seem fun and exciting.
Bringing users straight into a gaming atmosphere is the best way how to introduce them to a game. The Goin Nutty cartoon website offers desktop and iPhone wallpapers, designed in the same pastel earthy colors as in the game, to immerse visitors into what the game delivers.