The free black white HTML template is a good example of versatility and performance. This template is flexible and comes with great performance.
Links: preview | download this free template
Sections in this black white HTML template
We’ll start by describing the building items in this template – the Sections. You can stack them vertically in your page, fill in your content, and personalize the look and feel. It’s that easy. We’ll describe a bit how easy it is to work with the sections and how you can personalize them.
First, each section in this black white HTML template contains a group of components. Usually, a title, description, image and one or two call-to-actions (buttons and/or links). So far, it’s straight forward. You just add you content and that’s it. One note here – you can copy some items from one section to another. For example, if one section does not contain a link.
Second, you can change the background color of each section. That’s why this template is called black white HTML template. To illustrate exactly that. All you need to do is to change one parameter at the beginning of each section to define its background color. You can choose from five colors: white, light, grey, dark, or black background.
Last, the space at the top and bottom of each section can be defined by one parameter each. You can choose from xs to xl for each of these spaces. So, you’ll find two parameters at the beginning of each section. Each of these parameters can take the same values mentioned here.
Large image with text section
The third section in this black white HTML template is an image and a few text blocks on the right. We count it as a third section because the title above it (with a grey description above – called eyebrow text) is a section itself, just with two texts. Both of these sections combined, set to a white background each, make up an entire section on the page.
These two sections were created separately to add more flexibility and scalability to the template. Especially for editing and customizing it, but also for flexibility in the page vertical structure.
Center image with text on the sides
The black white HTML template comes with a few text and image sections. This section here with a center image is better suited for a longer list of text, distributed on both sides.
Two-column text section
Sometimes you may need to put in more text. This section is structured nicely on two columns, with groups of text that contain a title each. You can add links, buttons and a title section, as illustrated in the template.
You’ll find a few more sections that give you enough flexibility to scale up your pages.
Header and footer in the black white HTML template
These are two special sections that can be personalized similarly to the ones above. You can change, for example, the background color using the same values listed above. Moreover, these come with a bit more structure than you might need for a simple website. For example, the header has a sub-navigation with links and icons, just in case you might need it.
Look and feel of this free black white HTML template
The template is simple, clean, and stylish. And it can easily turn into a more professional look. You can personalize the overall look of your pages by choosing between two predefined fonts. Moreover, you can set a color for your buttons and links. Additionally, you can set each section to a predefined background color.
All these values can be set easily by switching through the available values for each parameter. Together with the sections included in this black white HTML template, you can turn your pages into a very large number of possible layouts.
Fonts
There are two fonts included into the template – stylish and professional. Additionally, these are the values you can define into one of the parameters in the body tag. Changing between these two will change the font throughout the entire page. All titles, descriptions, links will change accordingly.
You can also insert your own fonts with a bit of knowledge on this topic.
Colors
There are six colors to choose from for your buttons and links. As for the font topic above, there is one parameter in the body tag that sets all links and buttons to the predefined color. Your choices for colors are pink, red, orange, green, blue, and cyan.
Second, the sections can take a background color, separate from each other. This way you can have a full light mode page or a dark mode page or a mixed one. Like this one illustrated in the black white HTML template.
Balance and tone
These two are not easy to measure. And they are not feature themselves. But this template is balanced from the content to space ratio. The more content and smaller space between them, the cheaper and overwhelming it might look.
The black white HTML template provides balance out of the box. Moreover, it enables you to balance it easy by using the personalization parameters available, as described above.
The performance
The speed
First, this template is super-fast. That’s the biggest advantage html and css provides.
Second, the code is clean and simple. This way it’s also easy for you to personalize, duplicate or copy bits and pieces from one section to another maybe.
Third, it’s responsive and retina ready. It’s no news that we all use our mobile devices for almost anything in our digital lives. Therefore, this template ticks also this box.
Last, it’s SEO optimized so that you focus on the content, not on which tags you need and where.
Free black white HTML template – conclusions
This template is a good start for a clean, stylish, and lightning-fast website. This might be everything you need for a simple website. If you’ll need more, check out the premium version as well, which comes with more features, sections and documentation.
It’s also easy to personalize and work with. It’s intuitive to navigate through the code as it is easy, clean, and elegant.