diff --git a/packages/strapi-plugin-content-manager/admin/src/components/CustomTable/TableHeader.js b/packages/strapi-plugin-content-manager/admin/src/components/CustomTable/TableHeader.js
index e54e7aa06e..7e286caa77 100644
--- a/packages/strapi-plugin-content-manager/admin/src/components/CustomTable/TableHeader.js
+++ b/packages/strapi-plugin-content-manager/admin/src/components/CustomTable/TableHeader.js
@@ -63,7 +63,10 @@ function TableHeader({ headers, isBulkable }) {
                 {header.label}
 
                 {sortBy === header.name && (
-                  <Arrow className={`${sortOrder === 'ASC' && 'isAsc'}`} />
+                  <Arrow
+                    fill="#212529"
+                    isUp={sortOrder === 'ASC' && 'isAsc'}
+                  />
                 )}
               </span>
             </th>
diff --git a/packages/strapi-plugin-content-manager/admin/src/components/CustomTable/styledComponents.js b/packages/strapi-plugin-content-manager/admin/src/components/CustomTable/styledComponents.js
index cf9b43168a..ab6f332f26 100644
--- a/packages/strapi-plugin-content-manager/admin/src/components/CustomTable/styledComponents.js
+++ b/packages/strapi-plugin-content-manager/admin/src/components/CustomTable/styledComponents.js
@@ -1,6 +1,7 @@
 /* eslint-disable */
-
+import React from 'react';
 import styled, { css } from 'styled-components';
+import { Carret } from '@buffetjs/icons';
 
 const Table = styled.table`
   border-radius: 3px;
@@ -94,21 +95,14 @@ const TableRow = styled.tr`
   }
 `;
 
-const Arrow = styled.div`
-  &:after {
-    content: '\f0d8';
-    font-family: 'FontAwesome';
-    font-size: 13px;
-    font-weight: 600;
-    position: absolute;
-    top: 0px;
-    right: -12px;
-  }
-  &.isAsc {
-    &:after {
-      transform: rotateZ(180deg);
-    }
-  }
+const Arrow = styled(props => <Carret {...props} />)`
+  margin-left: 5px;
+  ${({ isUp }) =>
+    isUp &&
+    `
+    transform: rotateZ(180deg);
+
+  `}
 `;
 
 const Truncate = styled.div``;
diff --git a/packages/strapi-plugin-content-manager/admin/src/components/RepeatableComponent/Banner.js b/packages/strapi-plugin-content-manager/admin/src/components/RepeatableComponent/Banner.js
index 29ca56ff07..9551341b87 100644
--- a/packages/strapi-plugin-content-manager/admin/src/components/RepeatableComponent/Banner.js
+++ b/packages/strapi-plugin-content-manager/admin/src/components/RepeatableComponent/Banner.js
@@ -1,12 +1,11 @@
 import React, { forwardRef } from 'react';
 import { FormattedMessage } from 'react-intl';
 import PropTypes from 'prop-types';
-import { Grab } from '@buffetjs/icons';
+import { Carret, Grab } from '@buffetjs/icons';
 import { FontAwesomeIcon } from '@fortawesome/react-fontawesome';
 import pluginId from '../../pluginId';
 import PreviewCarret from '../PreviewCarret';
 import BannerWrapper from './BannerWrapper';
-import CarretTop from './CarretTop';
 
 /* eslint-disable jsx-a11y/no-static-element-interactions */
 
@@ -45,7 +44,7 @@ const Banner = forwardRef(
         {isDragging && <PreviewCarret isComponent />}
         <>
           <span className="img-wrapper" style={{ display }}>
-            <CarretTop isOpen={isOpen} hasErrors={hasErrors} />
+            <Carret isOpen={isOpen} hasErrors={hasErrors} />
           </span>
 
           <FormattedMessage
diff --git a/packages/strapi-plugin-upload/admin/src/components/SortPicker/index.js b/packages/strapi-plugin-upload/admin/src/components/SortPicker/index.js
index a4f2d29d09..3999153398 100644
--- a/packages/strapi-plugin-upload/admin/src/components/SortPicker/index.js
+++ b/packages/strapi-plugin-upload/admin/src/components/SortPicker/index.js
@@ -2,10 +2,9 @@ import React, { useState } from 'react';
 import PropTypes from 'prop-types';
 import { FormattedMessage } from 'react-intl';
 
+import { Carret } from '@buffetjs/icons';
 import getTrad from '../../utils/getTrad';
 
-import Carret from '../../icons/Carret';
-
 import DropdownButton from '../DropdownButton';
 import DropdownSection from '../DropdownSection';
 import SortList from '../SortList';
@@ -37,7 +36,7 @@ const SortPicker = ({ onChange, value }) => {
     <Wrapper>
       <DropdownButton onClick={hangleToggle} isActive={isOpen}>
         <FormattedMessage id={getTrad('sort.label')} />
-        <Carret isUp={!isOpen} />
+        <Carret fill={isOpen ? '#007EFF' : '#292b2c'} />
       </DropdownButton>
       <DropdownSection isOpen={isOpen}>
         <SortList
diff --git a/packages/strapi-plugin-upload/admin/src/icons/Carret/index.js b/packages/strapi-plugin-upload/admin/src/icons/Carret/index.js
deleted file mode 100644
index 2709c39388..0000000000
--- a/packages/strapi-plugin-upload/admin/src/icons/Carret/index.js
+++ /dev/null
@@ -1,13 +0,0 @@
-import React from 'react';
-
-const Carret = () => {
-  return (
-    <svg width="7" height="5" xmlns="http://www.w3.org/2000/svg">
-      <path
-        d="M0 .469c0 .127.043.237.13.33l3.062 3.28a.407.407 0 0 0 .616 0L6.87.8A.467.467 0 0 0 7 .468a.467.467 0 0 0-.13-.33A.407.407 0 0 0 6.563 0H.438A.407.407 0 0 0 .13.14.467.467 0 0 0 0 .468z"
-        fillRule="nonzero"
-      />
-    </svg>
-  );
-};
-export default Carret;