From b67ed2619d8923e29ef2cf59abd256a35ce2c0f6 Mon Sep 17 00:00:00 2001 From: Maaxxs <61059039+MaaxxsDev@users.noreply.github.com> Date: Tue, 7 Jul 2026 00:07:05 +0200 Subject: [PATCH] Make the background grain texture much more visible Bumped the noise layer's alpha from 0.05/0.055 to 0.35/0.4 and coarsened the turbulence frequency slightly - the previous version was too subtle to notice at a glance. Co-Authored-By: Claude Sonnet 5 --- hifi-src/src/index.css | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/hifi-src/src/index.css b/hifi-src/src/index.css index 8f53530..7538959 100644 --- a/hifi-src/src/index.css +++ b/hifi-src/src/index.css @@ -11,16 +11,16 @@ html { mask-image: linear-gradient(to right, transparent, black 6%, black 94%, transparent); } -/* Feines Papierkorn als Hintergrundstruktur statt einer reinen Flaeche - erinnert an - leicht zerknittertes Papier. Sehr kontrastarm, damit es nie mit Text/Bildern konkurriert. - Das Weiss ist bewusst etwas gedaempft (statt reinem #fff), das blendet weniger. */ +/* Deutlich sichtbares Papierkorn als Hintergrundstruktur statt einer reinen Flaeche - + erinnert an grobkoerniges Papier/Filmkorn. Bewusst kraeftiger eingestellt (hoher Alpha- + Multiplikator in der feColorMatrix), damit die Struktur ohne genaues Hinsehen auffaellt. */ .page-texture { background-color: #f6f5f0; - background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch' result='noise'/%3E%3CfeColorMatrix in='noise' type='matrix' values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.05 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.7' numOctaves='3' stitchTiles='stitch' result='noise'/%3E%3CfeColorMatrix in='noise' type='matrix' values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.35 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); background-size: 180px 180px; } .dark .page-texture { background-color: #0a0b07; - background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch' result='noise'/%3E%3CfeColorMatrix in='noise' type='matrix' values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.055 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); + background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.7' numOctaves='3' stitchTiles='stitch' result='noise'/%3E%3CfeColorMatrix in='noise' type='matrix' values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.4 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }