Industrious


A collection of simple CSS, HTML & Responsive site templates, built by us and released for free under the Creative Commons.
Thank you for choosing TEMPLATED for your next project!
At TEMPLATED, we are happy to provide you with beautiful and responsive website HTML5/CSS3 templates free of charge.
This is because we believe everyone has the right to create and that creativity is not supposed to be limited by paywalls.
When using our templates or themes, we appreciate it if you left the TEMPLATED reference in the copyright section of your template.
This helps us reach more people and enables more people the freedom to create websites for free.
Most internet users today are using the web on their mobile phone or tablet.
That's why website templates today must be responsive and have the appropriate, efficient, and minimal CSS along its HTML to run nicely on all available dimensions for browsers.
At TEMPLATED, you will only find beautiful free CSS3 templates with optimized code for a smooth, responsive design.
We've made it very easy for you to download our website templates free of charge.
All you need to do is to choose the free HTML5/CSS3 template you like the most from the section above.
Then follow the steps below to download your desired CSS website template.
Note: All of our CSS templates are open source.
Who is our target audience to use our templates?
People using our HTML5 templates usually look for a simple design with advanced, fast, optimized code.
For example, if you are doing a project and want a simple design to showcase information in a beautiful responsive way, our templates would be the best option.
We are pleased that prominent universities and governments use our templates consistently.
When choosing between an open-source CSS template or a theme that you can use with a CMS such as WordPress, you must know certain things.
One important thing to know is that templates require a higher knowledge of HTML and CSS code.
Themes today are used with a CMS and help with a lot of the complex coding by having so-called page builders.
If you are new to HTML, these ten attributes will give you a brief overview of using and reading elements in our template source codes.
Example: <div class="example">This is a div with a class attribute.</div>
Example: <div id="unique">This is a div with an id attribute.</div>
Example: <p style="color:green;">This is a paragraph with a style attribute.</p>
Example: <img src="templated.jpg" alt="An image of the Templated.co website">
Example: <img src="image.jpg" alt="An example image">
Example: <a href="https://templated.co/">Visit Templated.co</a>
Example: <input type="text" value="Default text">
Example: <input type="text" placeholder="Enter your name">
Example: <input type="text" disabled>
Example: <input type="text" disabled value="You can't change this">
Important to remember: HTML attributes should always be included in an HTML element's start or opening tag.
If you are new to CSS, these ten CSS properties will go a long way when working with our free CSS templates.
p {
color: green;
}
background-color : This property sets the background color of an element. Example:
div {
background-color: lightblue;
}
font-size : This property sets the size of the font. Example:
h1 {
font-size: 30px;
}
font-family : This property specifies the font for text in an element. Example:
body {
font-family: Arial, sans-serif;
}
text-align : This property sets the horizontal alignment of text. Example:
p {
text-align: center;
}
margin : This property sets the margin area on all four sides of an element. Example:
div {
margin: 10px;
}
padding : This property sets the padding area on all four sides of an element. Example:
div {
padding: 20px;
}
border : This property sets the border around an element. Example:
img {
border: 2px solid black;
}
width and height : These properties set the width and height of an element. Example:
img {
width: 500px;
height: height: 300px;
}
display : This property sets how an element is displayed. Common values are block
, inline
, inline-block
, flex
, grid
, none
, etc. Example:
div {
display: flex;
}
Important to remember: CSS can be added to HTML documents in 3 ways: Inline - by using the style
attribute inside HTML elements, Internal - by using a <style>
block in the <head>
section, or External - by using an external CSS file. The best way to add CSS, especially for large-scale apps, is to use an external stylesheet (.css).
Our templates can be used for many designs and many different purposes.
Here are some of the categories that our website templates fall under:
These are just some examples of designs our templates are well suited for.
Only your imagination sets the limit.