diff --git a/public/images/dollar-sign.svg b/public/images/dollar-sign.svg
new file mode 100644
index 00000000..ae6c8b37
--- /dev/null
+++ b/public/images/dollar-sign.svg
@@ -0,0 +1,3 @@
+<svg width="12" height="23" viewBox="0 0 12 23" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M8.81201 15.5813C8.81201 14.9172 8.60107 14.3704 8.1792 13.9407C7.75732 13.5032 7.0542 13.1125 6.06982 12.7688C5.08545 12.4172 4.31982 12.093 3.77295 11.7961C1.95264 10.8196 1.04248 9.37427 1.04248 7.46021C1.04248 6.16333 1.43701 5.09692 2.22607 4.26099C3.01514 3.42505 4.08545 2.92896 5.43701 2.77271V0.218018H7.31201V2.79614C8.67139 2.99146 9.72217 3.56958 10.4644 4.53052C11.2065 5.48364 11.5776 6.72583 11.5776 8.25708H8.7417C8.7417 7.27271 8.51904 6.49927 8.07373 5.93677C7.63623 5.36646 7.03857 5.0813 6.28076 5.0813C5.53076 5.0813 4.94482 5.28442 4.52295 5.69067C4.10107 6.09692 3.89014 6.67896 3.89014 7.43677C3.89014 8.11646 4.09717 8.66333 4.51123 9.07739C4.93311 9.48364 5.64404 9.87036 6.64404 10.2375C7.64404 10.6047 8.4292 10.9446 8.99951 11.2571C9.56982 11.5696 10.0503 11.929 10.4409 12.3352C10.8315 12.7336 11.1323 13.1946 11.3433 13.718C11.5542 14.2415 11.6597 14.8547 11.6597 15.5579C11.6597 16.8782 11.2534 17.9485 10.4409 18.7688C9.63623 19.5891 8.51123 20.0735 7.06592 20.2219V22.5071H5.20264V20.2336C3.65576 20.0618 2.46436 19.5071 1.62842 18.5696C0.800293 17.6321 0.38623 16.3899 0.38623 14.843H3.23389C3.23389 15.8274 3.47998 16.5891 3.97217 17.1282C4.47217 17.6672 5.17529 17.9368 6.08154 17.9368C6.97217 17.9368 7.64795 17.7219 8.10889 17.2922C8.57764 16.8625 8.81201 16.2922 8.81201 15.5813Z" fill="#333333"/>
+</svg>
diff --git a/src/features/MatchCard/CardSoon/index.tsx b/src/features/MatchCard/CardSoon/index.tsx
index d13bba7d..b330b403 100644
--- a/src/features/MatchCard/CardSoon/index.tsx
+++ b/src/features/MatchCard/CardSoon/index.tsx
@@ -20,6 +20,7 @@ import {
   TournamentName,
   TeamLogos,
   TeamLogo,
+  BuyMatchButton,
 } from '../styled'
 
 const CardWrapper = styled(CommonCardWrapper)`
@@ -37,6 +38,7 @@ type CardSoonProps = {
 
 export const CardSoon = ({
   match: {
+    availableBySubscription,
     date,
     sportType,
     team1,
@@ -72,6 +74,7 @@ export const CardSoon = ({
             profileType={ProfileTypes.TEAMS}
           />
         </TeamLogos>
+        {!availableBySubscription && <BuyMatchButton />}
       </PreviewWrapper>
       <Info>
         {showSportName && <SportName sport={sportType} />}
diff --git a/src/features/MatchCard/MatchInfoCard/index.tsx b/src/features/MatchCard/MatchInfoCard/index.tsx
index 51d10bfa..e3cc2b0e 100644
--- a/src/features/MatchCard/MatchInfoCard/index.tsx
+++ b/src/features/MatchCard/MatchInfoCard/index.tsx
@@ -22,6 +22,7 @@ import {
   TournamentName,
   TeamLogos,
   TeamLogo,
+  BuyMatchButton,
 } from '../styled'
 
 type Props = {
@@ -33,6 +34,7 @@ type Props = {
 
 export const MatchInfoCard = ({
   match: {
+    availableBySubscription,
     date,
     hasVideo,
     preview,
@@ -89,6 +91,7 @@ export const MatchInfoCard = ({
               </TeamLogos>
             )
         }
+        {!availableBySubscription && <BuyMatchButton />}
       </PreviewWrapper>
       <Info>
         {showSportName && <SportName sport={sportType} />}
diff --git a/src/features/MatchCard/styled.tsx b/src/features/MatchCard/styled.tsx
index 509295f9..13381153 100644
--- a/src/features/MatchCard/styled.tsx
+++ b/src/features/MatchCard/styled.tsx
@@ -43,6 +43,7 @@ export const CardWrapper = styled.li.attrs({
 `
 
 export const PreviewWrapper = styled.div`
+  position: relative;
   display: flex;
   flex-direction: column-reverse;
   height: 147px;
@@ -70,10 +71,13 @@ export const MatchDate = styled.div`
   font-weight: bold;
   text-transform: uppercase;
   letter-spacing: 0.1em;
-  text-align: center;
+  display: flex;
+  align-items: center;
+  justify-content: center;
   white-space: nowrap;
   color: white;
-  background: #6D6D6D;
+  background-color: #6D6D6D;
+  z-index: 1;
 
   @media ${devices.tablet} {
     top: 10px;
@@ -82,6 +86,7 @@ export const MatchDate = styled.div`
     padding: 6px 8px;
   }
 `
+
 export const Time = styled.span`
   margin-left: 10px;
 `
@@ -205,6 +210,7 @@ export const TeamLogos = styled.div`
     padding-right: 20px;
   }
 `
+
 export const TeamLogo = styled(ProfileLogo)`
   width: 60px;
 
@@ -216,3 +222,25 @@ export const TeamLogo = styled(ProfileLogo)`
     width: 134px;
   }
 `
+
+export const BuyMatchButton = styled.button`
+  border: none;
+  background: none;
+  padding: 0;
+
+  position: absolute;
+  right: 12px;
+  bottom: 12px;
+  width: 40px;
+  height: 40px;
+  cursor: pointer;
+  z-index: 1;
+
+  background-image: url(/images/dollar-sign.svg);
+  background-position: center;
+  background-repeat: no-repeat;
+  background-color: #fff;
+  border-radius: 50%;
+  border: 0.5px solid rgba(0, 0, 0, 0.2);
+  box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.5);
+`
diff --git a/src/features/Matches/helpers/prepareMatches.tsx b/src/features/Matches/helpers/prepareMatches.tsx
index f4c3fcd2..c802c15c 100644
--- a/src/features/Matches/helpers/prepareMatches.tsx
+++ b/src/features/Matches/helpers/prepareMatches.tsx
@@ -11,10 +11,12 @@ const prepareMatch = ({
   id,
   sport,
   stream_status,
+  sub,
   team1,
   team2,
   tournament,
 }: Match) => ({
+  availableBySubscription: sub,
   date: format(new Date(date), 'dd.MM.yy'),
   hasVideo: has_video,
   id,
diff --git a/src/requests/getMatches/types.tsx b/src/requests/getMatches/types.tsx
index 4db90d8f..40469b89 100644
--- a/src/requests/getMatches/types.tsx
+++ b/src/requests/getMatches/types.tsx
@@ -22,6 +22,7 @@ export type Match = {
   round_id: number | null,
   sport: SportTypes,
   stream_status: MatchStatuses,
+  sub: boolean,
   team1: Team,
   team2: Team,
   tournament: Tournament,