---
layout: post
title:  "Header Full-Width-Image"
subheadline:  "Headers With Style"
description: "Feeling Responsive allows you to use all different kinds of headers. This example shows a header with a <em>full-width-image</em>."
categories:
    - design
tags:
    - design
    - background color
    - header
image:
   header: "unsplash_brooklyn-bridge_header.jpg"
   thumb: "unsplash_brooklyn-bridge_thumb.jpg"
---
It's so easy to do. Just define in front matter an image and a background color. Instead of a color you can also use a pattern image. Have a look at the [example with a background pattern]({{ site.url }}/design/header-pattern/).

## Front Matter Code

~~~
header:
    image:  "header_unsplash_2-970x.jpg"
    background-color:  "#fabb00"
~~~



## All Header-Styles 

{% include list-posts.html tag='header' %}