diff --git a/src/components/Footer/index.js b/src/components/Footer/index.js
new file mode 100644
index 0000000..656736d
--- /dev/null
+++ b/src/components/Footer/index.js
@@ -0,0 +1,34 @@
+import React from 'react';
+import { StaticQuery, graphql } from 'gatsby';
+
+import style from './style.module.css';
+
+const query = graphql`
+ query FooterQuery {
+ site {
+ siteMetadata {
+ buildId
+ }
+ }
+ }
+`;
+
+const Footer = () => (
+
+);
+
+export default Footer;
diff --git a/src/components/Footer/style.module.css b/src/components/Footer/style.module.css
new file mode 100644
index 0000000..71c42ee
--- /dev/null
+++ b/src/components/Footer/style.module.css
@@ -0,0 +1,26 @@
+@import url('../../globals.module.css');
+
+.footer {
+ display: flex;
+ align-items: flex-start;
+ margin: var(--spacing-margin) 0;
+
+ @media screen and (max-width: 800px) {
+ display: block;
+ }
+
+ & img {
+ vertical-align: text-top;
+ width: 80px;
+ height: 15px;
+ }
+}
+
+.list {
+ composes: inline-list with-separator-left;
+ flex: 1;
+}
+
+.buildId {
+ color: color(var(--color-brown) blend(var(--color-tan) 25%));
+}
diff --git a/src/components/Layout/index.js b/src/components/Layout/index.js
index 5ba6cd9..d4361f1 100644
--- a/src/components/Layout/index.js
+++ b/src/components/Layout/index.js
@@ -3,6 +3,7 @@ import PropTypes from 'prop-types';
import { Helmet } from 'react-helmet';
import Header from 'components/Header';
+import Footer from 'components/Footer';
const Layout = ({ title, children }) =>
@@ -10,6 +11,7 @@ const Layout = ({ title, children }) =>
{ children }
+
;
Layout.propTypes = {