diff --git a/src/components/HorizontalBulletList/index.js b/src/components/HorizontalBulletList/index.js
new file mode 100644
index 0000000..f4d3e13
--- /dev/null
+++ b/src/components/HorizontalBulletList/index.js
@@ -0,0 +1,16 @@
+import React from "react";
+import classNames from "classnames";
+import useStyles from "./styles";
+
+const HorizontalBulletList = props => {
+  const classes = useStyles();
+  return (
+    <ul className={classNames(classes.root, props.className)}>
+      {props.children}
+    </ul>
+  );
+};
+
+HorizontalBulletList.defaultProps = {};
+
+export default HorizontalBulletList;
diff --git a/src/components/HorizontalBulletList/index.stories.js b/src/components/HorizontalBulletList/index.stories.js
new file mode 100644
index 0000000..f7778a3
--- /dev/null
+++ b/src/components/HorizontalBulletList/index.stories.js
@@ -0,0 +1,31 @@
+import React from "react";
+import theme from "../../theme";
+import { HorizontalBulletList } from "../../index";
+import { storiesOf } from "@storybook/react";
+import { jsxDecorator } from "storybook-addon-jsx";
+import { muiTheme } from "storybook-addon-material-ui";
+import { Typography } from "@material-ui/core";
+
+const stories = storiesOf("Horizontal bullet list", HorizontalBulletList);
+
+stories.addDecorator(jsxDecorator).addDecorator(muiTheme([theme]));
+
+stories.add("Default", () => (
+  <HorizontalBulletList>
+    <Typography component="li" variant="body2">
+      Hello
+    </Typography>
+
+    <Typography component="li" variant="body2">
+      Hello
+    </Typography>
+
+    <Typography component="li" variant="body2">
+      Hello
+    </Typography>
+
+    <Typography component="li" variant="body2">
+      Hello
+    </Typography>
+  </HorizontalBulletList>
+));
diff --git a/src/components/HorizontalBulletList/styles.js b/src/components/HorizontalBulletList/styles.js
new file mode 100644
index 0000000..cdd9c03
--- /dev/null
+++ b/src/components/HorizontalBulletList/styles.js
@@ -0,0 +1,21 @@
+import { makeStyles } from "@material-ui/styles";
+
+export default makeStyles(theme => ({
+  root: {
+    paddingLeft: 0,
+    listStyleType: "none",
+    "& li": {
+      display: "inline",
+      whiteSpace: "nowrap",
+      marginRight: theme.spacing(2),
+      color: "rgba(0,0,0,.36)",
+    },
+    "& li:after": {
+      content: '"·"',
+      marginLeft: theme.spacing(2),
+    },
+    "& li:last-child::after": {
+      content: "none",
+    },
+  },
+}));
diff --git a/src/index.js b/src/index.js
index 86eebfa..4b3bccc 100644
--- a/src/index.js
+++ b/src/index.js
@@ -2,6 +2,7 @@ import InfoBoxComponent from "./components/InfoBox";
 import ProgressButtonComponent from "./components/ProgressButton";
 import KeyNumberBlockComponent from "./components/KeyNumberBlock";
 import ExpandableBottomSheetComponent from "./components/ExpandableBottomSheet";
+import HorizontalBulletListComponent from "./components/HorizontalBulletList";
 import Dhis2IconComponent from "./components/Dhis2Icon";
 import DuoToneChipComponent from "./components/DuoToneChip";
 
@@ -9,5 +10,6 @@ export const InfoBox = InfoBoxComponent;
 export const ProgressButton = ProgressButtonComponent;
 export const KeyNumberBlock = KeyNumberBlockComponent;
 export const ExpandableBottomSheet = ExpandableBottomSheetComponent;
+export const HorizontalBulletList = HorizontalBulletListComponent;
 export const Dhis2Icon = Dhis2IconComponent;
 export const DuoToneChip = DuoToneChipComponent;