diff --git a/BudgetMasterServer/src/main/resources/static/css/transactions.css b/BudgetMasterServer/src/main/resources/static/css/transactions.css
index 87e22526fb8f2dab0b039104b54a9786fbe56392..f39f3e04bc9665e9b3e9ab172201215838183fdf 100644
--- a/BudgetMasterServer/src/main/resources/static/css/transactions.css
+++ b/BudgetMasterServer/src/main/resources/static/css/transactions.css
@@ -50,6 +50,10 @@
     background-color: var(--color-background-light-transparent) !important;
 }
 
+.transaction-row-transparent .transaction-row-transparent-child {
+    opacity: 0.5;
+}
+
 .transaction-row-highlighted {
     background-color: var(--color-blue-light) !important;
     opacity: 1.0 !important;
diff --git a/BudgetMasterServer/src/main/resources/templates/transactions/transactionsMacros.ftl b/BudgetMasterServer/src/main/resources/templates/transactions/transactionsMacros.ftl
index 57dfd6b4e9807c09a9526b2bdfb45ec7378d88cc..abd1370458e2ad39a68d73991f0e38a164909769 100644
--- a/BudgetMasterServer/src/main/resources/templates/transactions/transactionsMacros.ftl
+++ b/BudgetMasterServer/src/main/resources/templates/transactions/transactionsMacros.ftl
@@ -2,7 +2,7 @@
 <#import "../helpers/header.ftl" as header>
 
 <#macro transactionType transaction size>
-    <div class="col ${size} left-align">
+    <div class="col ${size} left-align transaction-row-transparent-child">
         <#if transaction.isRepeating()>
             <i class="material-icons">repeat</i>
         </#if>
@@ -18,7 +18,7 @@
 
 <#macro transactionCategory transaction alignment>
     <#import "../categories/categoriesFunctions.ftl" as categoriesFunctions>
-    <div class="col s2 l1 xl1 ${alignment}">
+    <div class="col s2 l1 xl1 ${alignment} transaction-row-transparent-child">
         <div class="hide-on-med-and-down">
             <@categoriesFunctions.categoryCircle category=transaction.category enableSearchWrapper=true/>
         </div>
@@ -29,7 +29,7 @@
 </#macro>
 
 <#macro transactionNameAndDescription transaction size>
-    <div class="col ${size}">
+    <div class="col ${size} transaction-row-transparent-child">
         <div class="truncate transaction-text">${transaction.name}</div>
         <div class="hide-on-med-and-down">
             <#if transaction.description??>
@@ -42,9 +42,9 @@
 <#macro transactionAmount transaction account size>
     <#assign amount = helpers.getAmount(transaction, account)/>
     <#if amount <= 0>
-        <div class="col ${size} bold ${redTextColor} no-wrap right-align transaction-text">${currencyService.getCurrencyString(amount)}</div>
+        <div class="col ${size} bold ${redTextColor} no-wrap right-align transaction-text transaction-row-transparent-child">${currencyService.getCurrencyString(amount)}</div>
     <#else>
-        <div class="col ${size} bold ${greenTextColor} no-wrap right-align transaction-text">${currencyService.getCurrencyString(amount)}</div>
+        <div class="col ${size} bold ${greenTextColor} no-wrap right-align transaction-text transaction-row-transparent-child">${currencyService.getCurrencyString(amount)}</div>
     </#if>
 </#macro>
 
@@ -86,7 +86,7 @@
     <#if helpers.getCurrentAccount().getType().name() == "ALL" && transaction.getAccount()??>
         <#import "../helpers/customSelectMacros.ftl" as customSelectMacros>
         <a href="<@s.url '/accounts/' + transaction.getAccount().getID() + '/select'/>">
-            <div class="col s2 l1 xl1 tooltipped no-padding" data-position="bottom" data-tooltip="${transaction.getAccount().getName()}">
+            <div class="col s2 l1 xl1 tooltipped no-padding transaction-row-transparent-child" data-position="bottom" data-tooltip="${transaction.getAccount().getName()}">
                 <div class="hide-on-med-and-down">
                     <@customSelectMacros.accountIcon transaction.getAccount() transaction.getAccount().getName()/>
                 </div>