diff --git a/src/components/SkewedContainer.js b/src/components/SkewedContainer.js
new file mode 100644
index 000000000..d372287d8
--- /dev/null
+++ b/src/components/SkewedContainer.js
@@ -0,0 +1,17 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import cx from 'classnames';
+import styles from './SkewedContainer.module.scss';
+
+const SkewedContainer = ({ className, children }) => (
+  <div className={cx(styles.container, className)}>
+    <div className={styles.content}>{children}</div>
+  </div>
+);
+
+SkewedContainer.propTypes = {
+  className: PropTypes.string,
+  children: PropTypes.node,
+};
+
+export default SkewedContainer;
diff --git a/src/components/SkewedContainer.module.scss b/src/components/SkewedContainer.module.scss
new file mode 100644
index 000000000..d26d0911e
--- /dev/null
+++ b/src/components/SkewedContainer.module.scss
@@ -0,0 +1,8 @@
+.container {
+  background: var(--color-neutrals-100);
+  transform: skew(0, -2deg);
+}
+
+.content {
+  transform: skew(0, 2deg);
+}