{"id":29,"date":"2007-07-31T16:42:57","date_gmt":"2007-07-31T23:42:57","guid":{"rendered":"http:\/\/css-tricks.com\/homebase-a-simple-free-template-for-all\/"},"modified":"2014-10-30T15:04:41","modified_gmt":"2014-10-30T22:04:41","slug":"homebase-a-simple-free-template-for-all","status":"publish","type":"post","link":"https:\/\/css-tricks.com\/homebase-a-simple-free-template-for-all\/","title":{"rendered":"Homebase, a Simple Free Template for All"},"content":{"rendered":"

If you are just getting started with CSS, a great way to begin is by downloading a template and playing around with things and seeing what happens. You have to be careful though, some templates are so overly complicated that you might just drown while sifting through everything.<\/p>\n

Don’t worry though, we got you covered. Here is a entirely CSS template for a simple website that you can download, tweak, revamp, whatever you want! We’re calling it Homebase<\/strong>, because it can be a good starting place for any website. Even if you are a master coder, why waste your time with simple setup work?<\/p>\n

<\/figure>\n

Anywho, check it out and have fun!<\/p>\n

\n

Update:<\/strong> Hello. Chris from 2014 here. This demo is totally bad. You probably would be better off googling around and finding something more modern. I’m going to leave it here though because that’s just kinda good for the internet.<\/p>\n<\/div>\n

View Demo<\/a>   Download<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"

If you are just getting started with CSS, a great way to begin is by downloading a template and playing around with things and seeing what happens. You have to be careful though, some templates are so overly complicated that you might just drown while sifting through everything. Don’t worry though, we got you covered. […]<\/p>\n","protected":false},"author":3,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_bbp_topic_count":0,"_bbp_reply_count":0,"_bbp_total_topic_count":0,"_bbp_total_reply_count":0,"_bbp_voice_count":0,"_bbp_anonymous_reply_count":0,"_bbp_topic_count_hidden":0,"_bbp_reply_count_hidden":0,"_bbp_forum_subforum_count":0,"sig_custom_text":"","sig_image_type":"featured-image","sig_custom_image":0,"sig_is_disabled":false,"inline_featured_image":false,"c2c_always_allow_admin_comments":false,"footnotes":"","jetpack_publicize_message":"","jetpack_is_tweetstorm":false,"jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":false,"jetpack_social_options":[]},"categories":[4],"tags":[],"jetpack_publicize_connections":[],"acf":[],"jetpack_featured_media_url":"","jetpack-related-posts":[{"id":94,"url":"https:\/\/css-tricks.com\/best-of-css-tricks-1\/","url_meta":{"origin":29,"position":0},"title":"The Best of CSS-Tricks Tutorials: Ten Free Downloadable Examples!","date":"September 17, 2007","format":false,"excerpt":"Welcome to CSS-Tricks! We've been busy trying to bring you tips, techniques, and tutorials about using Cascading Style Sheets. Along the way, we've written up a number of example pages showcasing various techniques. If you are new here, here is a look back at some of those examples: Apple-Like CSS\u2026","rel":"","context":"In "Article"","img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":284476,"url":"https:\/\/css-tricks.com\/crafting-reusable-html-templates\/","url_meta":{"origin":29,"position":1},"title":"Crafting Reusable HTML Templates","date":"March 19, 2019","format":false,"excerpt":"In our last article, we discussed the Web Components specifications (custom elements, shadow DOM, and HTML templates) at a high-level. In this article, and the three to follow, we will put these technologies to the test and examine them in greater detail and see how we can use them in\u2026","rel":"","context":"In "Article"","img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":278051,"url":"https:\/\/css-tricks.com\/simple-named-grid-areas\/","url_meta":{"origin":29,"position":2},"title":"Simple Named Grid Areas","date":"November 2, 2018","format":false,"excerpt":"I think of named grid areas in CSS Grids as bring-your-own syntactic sugar. You don't absolutely need them (you could express grid placement in other ways), but it can make that placement more intuitive. And, hey, if I'm wrong about that, correct me in the comments. Say you set up\u2026","rel":"","context":"In "Article"","img":{"alt_text":"","src":"https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2018\/06\/grid-ascii.png?fit=1200%2C600&ssl=1&resize=350%2C200","width":350,"height":200},"classes":[]},{"id":376528,"url":"https:\/\/css-tricks.com\/animating-css-grid-how-to-examples\/","url_meta":{"origin":29,"position":3},"title":"Animating CSS Grid (How To + Examples)","date":"January 25, 2023","format":false,"excerpt":"I\u2019m pleased to shine a light on the fact that the CSS grid-template-rows and grid-template-columns properties are now animatable in all major web browsers! Well, CSS Grid has technically supported animations for a long time, as it\u2019s baked right into the CSS Grid Layout Module Level 1 spec. But animating\u2026","rel":"","context":"In "Article"","img":{"alt_text":"","src":"https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2023\/01\/grid-animation.jpg?fit=1200%2C600&ssl=1&resize=350%2C200","width":350,"height":200},"classes":[]},{"id":252690,"url":"https:\/\/css-tricks.com\/getting-started-css-grid\/","url_meta":{"origin":29,"position":4},"title":"Getting Started with CSS Grid","date":"March 13, 2017","format":false,"excerpt":"Why is CSS Grid a big deal and why should we care? Well, CSS Grid is the first real layout system for the web. It's designed for organizing content both into columns and rows and it finally gives developers almost God-like control of the screens before us. That means that\u2026","rel":"","context":"In "Article"","img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":20313,"url":"https:\/\/css-tricks.com\/mixing-responsive-design-and-mobile-templates\/","url_meta":{"origin":29,"position":5},"title":"Mixing Responsive Design and Mobile Templates","date":"March 4, 2013","format":false,"excerpt":"You need a mobile strategy for your site. You have to pick Responsive Design or a dedicated mobile site, right? Maybe not. Maybe you can mix and match a variety of strategies. Me and the team are working hard on CodePen every day. But we're a team of three. Our\u2026","rel":"","context":"In "Article"","img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]}],"_links":{"self":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/posts\/29"}],"collection":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/users\/3"}],"replies":[{"embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/comments?post=29"}],"version-history":[{"count":3,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/posts\/29\/revisions"}],"predecessor-version":[{"id":187371,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/posts\/29\/revisions\/187371"}],"wp:attachment":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/media?parent=29"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/categories?post=29"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/tags?post=29"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}