Wie Matsuko, finde ich Videos manchmal ebenfalls zu dunkel, wenn ich abends Netflix oder YouTube schaue. In der Regel stelle ich dann den Bildschirm heller, ich würde aber lieber nur das Video heller stellen. Mit dem folgenden Codeschnipsel kann man genau das tun. /* Brighter Netflix and YouTube videos */ video[src^="blob:https://www.netflix.com/"], video[src^="blob:https://www.youtube.com/"] { filter: brightness(1.4); }
Solltet ihr ein Gerät nutzen, das einen Darkmode hat, so färbt sich dieses kleine Blog nun auch entsprechend eurer Systemeinstellung. Mit Hilfe der Beschreibung von Jeremy Keith konnte ich das ganz schnell umsetzen. Eigentlich ist es sehr, sehr einfach. Einfach den folgenden Code in seine style.css packen und die gewünschten CSS-Eigenschaften für den Darkmode hinterlegen. @media (prefers-color-scheme: dark) { /* Darkmode CSS-Eigenschaften hier */ } Man könnte jetzt noch überlegen, ob man einen Schalter im Blog möchte, mit dem man die Einstellung überschreiben kann. Thomas Steiner beschreibt das hier auch ganz gut. ...
Schatten in CSS von Hand zu schreiben ist zwar möglich aber ein Krampf. Es gibt schon seit Jahren diverse Tools, um visuell schöne Schatten zu erstellen. Ein weiteres Tool ist von Philipp Brumm. Smooth Shadow Für alle die nicht wissen was gemeint ist, ein simpler Schatten in CSS kann so aussehen: box-shadow: 0 2.8px 2.2px rgba(0, 0, 0, 0.02), 0 6.7px 5.3px rgba(0, 0, 0, 0.028),
Was man inzwischen mit reinem CSS anstellen kann ist schon erstaunlich. Was man alles in einem einzigen div bekommt, zeigt die Seite A Single Div von Lynn Fisher. Von Köpfen, über Süßigkeiten, Comicfiguren hin zu schönen Symbolen ist alles dabei. Wirklich beeindruckende Spielerei. Thank you Stefan
CSS3 Filters: Altering HTML and Images with just CSS → CSS3 Filters are a quite interesting offshoot from SVG, allowing you to modify HTML elements and images with blurs, brightness and a lot more. In this quick tutorial we’ll go over exactly how they’re going to work. Schwarz-Weiß- und Blur-Filter sollten unbedingt in den HTML5-Standard aufgenommen werden. Damit könnte man so großartige Dinge umsetzen. Thank you Jonathan