diff --git a/src/components/AppLogo.jsx b/src/components/AppLogo.jsx
new file mode 100644
index 0000000..ebbdc02
--- /dev/null
+++ b/src/components/AppLogo.jsx
@@ -0,0 +1,12 @@
+// import Logo from "../assets/logo.svg"
+import Logo from "../assets/logo-commit.png"
+
+export const AppLogo = () => {
+    return (
+        <div >
+            <a href={'/'}>
+                <img style={{width: '192px'}} src={Logo}/>
+            </a>
+        </div>
+    )
+}
\ No newline at end of file
diff --git a/src/components/Layout.jsx b/src/components/Layout.jsx
new file mode 100644
index 0000000..d9a5f28
--- /dev/null
+++ b/src/components/Layout.jsx
@@ -0,0 +1,24 @@
+import './../css/Layout.css'
+import {
+    Header,
+    Footer,
+    Padding
+} from '.'
+
+
+const Layout = ({ children, ...props }) => {
+    return (
+    <>
+        <Padding>
+            <Header/>
+            <div className='content'>
+                <div className="inside">{children}</div>
+            </div>
+            
+        </Padding>
+        <Footer/>
+    </>
+    )
+}
+
+export default Layout
diff --git a/src/components/Padding.jsx b/src/components/Padding.jsx
new file mode 100644
index 0000000..3c624fc
--- /dev/null
+++ b/src/components/Padding.jsx
@@ -0,0 +1,12 @@
+import './../css/Padding.css'
+
+export const Padding = ({
+    children = null,
+    ...props
+}) => {
+    return (
+        <div className='padding'  {...props}>
+            {children}
+        </div>
+    )
+}
\ No newline at end of file
diff --git a/src/components/Title.jsx b/src/components/Title.jsx
new file mode 100644
index 0000000..de84ebf
--- /dev/null
+++ b/src/components/Title.jsx
@@ -0,0 +1,11 @@
+import '../css/Title.css'
+
+export const Title = ({text,size,color,weight}) => {
+    return (
+        <div className='textElement' style={{
+            fontWeight:`${weight}`,
+            fontSize:`${size}`,
+            color: `${color}`
+        }}>{text}</div>
+    )
+}
\ No newline at end of file
diff --git a/src/components/index.jsx b/src/components/index.jsx
new file mode 100644
index 0000000..6e3146c
--- /dev/null
+++ b/src/components/index.jsx
@@ -0,0 +1,7 @@
+export * from './Padding'
+export * from './Header'
+export * from './AppLogo'
+export * from './Footer'
+export * from './Button'
+export * from './Title'
+