Responsive Landing Page UI Design for a Nutrition Page
This template is a perfect example of a landing page of a website in the nutrition/food niche. The main attraction of the design is the background image that uniformly blends with the rest of the design. It also provides a surface to display other important content. The colors used for the text and buttons are derived from the background image. This design is a responsive design for phones and tablets.
Given below are the colors used or can be used along with this template. The colors are mainly derived from the cover image. The 'Yellow Sea' color can be used for user-interactive elements such as buttons. The 'Solitude' color is primarily used as the background color. The color 'Nero' can be used for text. The color 'Persian Green' can be used for any secondary elements.
1. Roboto - This font is primarily used in the navigation bar text. You can get this font for free from Google Fonts - Google Fonts
2. Merriweather - This font is used in the main title of the page (Healthy Living). You can get this font for free from Google Fonts - Google Fonts
3. Open Sans - This font is used in the description text. You can get this font for free from Google Fonts - Google Fonts
This UI design is responsive, i.e it renders well on all types of devices such as smartphones, tablets, desktops, etc. You can see how it looks on different devices below. The complete code for this responsive design including HTML and CSS is also provided for free.
Responsive Website UI Design for a aqua fish page
Demo and Code for a responsive website UI Design for a aqua fish page
5 Simple Toggle Button Animation in HTML - Pure CSS
How to draw an image from internet on HTML canvas?
A guide on how to draw an image from internet on HTML canvas?