diff --git a/lib/Service/CardService.php b/lib/Service/CardService.php
index 5e770bc53c..5b81308781 100644
--- a/lib/Service/CardService.php
+++ b/lib/Service/CardService.php
@@ -396,7 +396,7 @@ public function cloneCard(int $id, ?int $targetStackId = null):Card {
 			$targetStackId = $originCard->getStackId();
 		}
 		$this->permissionService->checkPermission($this->stackMapper, $targetStackId, Acl::PERMISSION_EDIT);
-		$newCard = $this->create($originCard->getTitle(), $targetStackId, $originCard->getType(), $originCard->getOrder(), $originCard->getOwner());
+		$newCard = $this->create($originCard->getTitle(), $targetStackId, $originCard->getType(), $originCard->getOrder(), $originCard->getOwner(), color: $originCard->getColor());
 		$boardId = $this->stackMapper->findBoardId($targetStackId);
 		foreach ($this->labelMapper->findAssignedLabelsForCard($id) as $label) {
 			if ($boardId !== $this->stackMapper->findBoardId($originCard->getStackId())) {
diff --git a/src/components/cards/CardItem.vue b/src/components/cards/CardItem.vue
index 702267f267..dacc063f9c 100644
--- a/src/components/cards/CardItem.vue
+++ b/src/components/cards/CardItem.vue
@@ -8,7 +8,7 @@
 		<div
 			:ref="`card${card.id}`"
 			:class="{compact: compactMode, 'current-card': isCurrentCard, 'no-labels': !hasLabels, card__editable: canEdit, card__archived: card.archived, card__highlight: highlight}"
-			:style="{backgroundColor: color}"
+			:style="cardStyle"
 			tag="div"
 			:tabindex="0"
 			class="card"
@@ -230,6 +230,19 @@ export default {
 		color() {
 			return this.card.color ? '#' + this.card.color : null
 		},
+
+		cardStyle() {
+			if (!this.card.color) {
+				return {}
+			}
+			const textColor = this.textColor(this.card.color)
+			return {
+				backgroundColor: this.color,
+				color: textColor,
+				'--color-main-text': textColor,
+				'--color-text-maxcontrast': textColor,
+			}
+		},
 	},
 
 	watch: {
diff --git a/tests/unit/Service/CardServiceTest.php b/tests/unit/Service/CardServiceTest.php
index 31cd46b4ef..6711d13b50 100644
--- a/tests/unit/Service/CardServiceTest.php
+++ b/tests/unit/Service/CardServiceTest.php
@@ -331,14 +331,19 @@ public function testClone() {
 		$card->setOwner('admin');
 		$card->setStackId(12345);
 		$card->setDescription('A test description');
+		$card->setColor('FF0000');
 
 		$clonedCard = clone $card;
 		$clonedCard->setId(2);
 		$clonedCard->setStackId(1234);
 
+		$inserted = [];
 		$this->cardMapper->expects($this->exactly(2))
 			->method('insert')
-			->willReturn($card, $clonedCard);
+			->willReturnCallback(function (Card $entity) use (&$inserted, $card, $clonedCard) {
+				$inserted[] = $entity;
+				return count($inserted) === 1 ? $card : $clonedCard;
+			});
 
 		$this->cardMapper->expects($this->once())
 			->method('update')->willReturn($clonedCard);
@@ -408,6 +413,7 @@ public function testClone() {
 		$this->assertNotEquals($b->getStackId(), $c->getStackId());
 
 		$this->assertEquals('A test description', $c->getDescription());
+		$this->assertEquals('FF0000', $inserted[1]->getColor());
 
 		$this->assertCount(1, $c->getLabels());
 		$this->assertEquals($label->getId(), $c->getLabels()[0]->getId());