diff --git a/src/components/MDXComponents.tsx b/src/components/MDXComponents.tsx
index 54c03220f8..c8296ccc62 100644
--- a/src/components/MDXComponents.tsx
+++ b/src/components/MDXComponents.tsx
@@ -1,4 +1,14 @@
-import { Flex, Heading, Link, Stack, Table, Text } from '@chakra-ui/react';
+import {
+  Flex,
+  Heading,
+  Link,
+  ListItem,
+  OrderedList,
+  Stack,
+  Table,
+  Text,
+  UnorderedList
+} from '@chakra-ui/react';
 import NextLink from 'next/link';
 
 import { Code } from './UI/docs';
@@ -85,6 +95,9 @@ const MDXComponents = {
   ul: ({children}: any) => {
     return <UnorderedList mb={7} px={4}>{children}</UnorderedList>
   },
+  ol: ({children}: any) => {
+    return <OrderedList mb={7} px={4}>{children}</OrderedList>
+  },
   li: ({ children }: any) => {
     return <ListItem color='primary'>{children}</ListItem>
   }