diff --git a/home/swaync/default.nix b/home/swaync/default.nix
index 1bb1d388..c8b8c41a 100644
--- a/home/swaync/default.nix
+++ b/home/swaync/default.nix
@@ -1 +1,348 @@
-{...}: {xdg.configFile."swaync/style.css".source = ./style.css;}
+{config, ...}: {
+  xdg.configFile."swaync/style.css".text = with config.lib.stylix.colors; ''
+    * {
+    	all: unset;
+    	font-size: ${toString config.stylix.fonts.sizes.desktop}px;
+    	font-family: "${config.stylix.fonts.monospace.name}";
+    	transition: 200ms;
+    }
+
+    .floating-notifications.background .notification-row .notification-background {
+    	border-radius: 10px;
+    	border: 1px solid ${withHashtag.magenta};
+    	margin: 18px;
+    	background-color: rgba(${base00-rgb-r}, ${base00-rgb-g}, ${base00-rgb-b}, 0.5);
+    	color: ${withHashtag.base05};
+    	padding: 0;
+    }
+
+    .floating-notifications.background
+    	.notification-row
+    	.notification-background
+    	.notification {
+    	padding: 7px;
+    	border-radius: 10px;
+    }
+
+    .floating-notifications.background
+    	.notification-row
+    	.notification-background
+    	.notification
+    	.notification-content {
+    	margin: 7px;
+    }
+
+    .floating-notifications.background
+    	.notification-row
+    	.notification-background
+    	.notification
+    	.notification-content
+    	.summary {
+    	color: ${withHashtag.base05};
+    }
+
+    .floating-notifications.background
+    	.notification-row
+    	.notification-background
+    	.notification
+    	.notification-content
+    	.time {
+    	color: ${withHashtag.base04};
+    }
+
+    .floating-notifications.background
+    	.notification-row
+    	.notification-background
+    	.notification
+    	.notification-content
+    	.body {
+    	color: ${withHashtag.base05};
+    }
+
+    .floating-notifications.background
+    	.notification-row
+    	.notification-background
+    	.notification
+    	> *:last-child
+    	> * {
+    	min-height: 3.4em;
+    }
+
+    .floating-notifications.background
+    	.notification-row
+    	.notification-background
+    	.notification
+    	> *:last-child
+    	> *
+    	.notification-action {
+    	border-radius: 10px;
+    	background-color: ${withHashtag.base01};
+    	color: ${withHashtag.base05};
+    	margin: 7px;
+    }
+
+    .floating-notifications.background
+    	.notification-row
+    	.notification-background
+    	.notification
+    	> *:last-child
+    	> *
+    	.notification-action:hover {
+    	background-color: ${withHashtag.base01};
+    	color: ${withHashtag.base05};
+    }
+
+    .floating-notifications.background
+    	.notification-row
+    	.notification-background
+    	.notification
+    	> *:last-child
+    	> *
+    	.notification-action:active {
+    	background-color: ${withHashtag.blue};
+    	color: ${withHashtag.base00};
+    }
+
+    .floating-notifications.background
+    	.notification-row
+    	.notification-background
+    	.close-button {
+    	margin: 7px;
+    	padding: 2px;
+    	border-radius: 10px;
+    	background-color: ${withHashtag.red};
+    	color: ${withHashtag.base00};
+    }
+
+    .floating-notifications.background
+    	.notification-row
+    	.notification-background
+    	.close-button:hover {
+    	background-color: ${withHashtag.red};
+    	color: ${withHashtag.base00};
+    }
+
+    .floating-notifications.background
+    	.notification-row
+    	.notification-background
+    	.close-button:active {
+    	background-color: ${withHashtag.red};
+    	color: ${withHashtag.base00};
+    }
+
+    .control-center {
+    	border-radius: 10px;
+    	border: 1px solid ${withHashtag.magenta};
+    	margin: 18px;
+    	background-color: rgba(${base00-rgb-r}, ${base00-rgb-g}, ${base00-rgb-b}, 0.5);
+    	color: ${withHashtag.base05};
+    	padding: 14px;
+    }
+
+    .control-center .widget-title {
+    	color: ${withHashtag.base05};
+    	font-size: 1.3em;
+    }
+
+    .control-center .widget-title button {
+    	border-radius: 7px;
+    	background-color: ${withHashtag.base01};
+    	color: ${withHashtag.base05};
+    	padding: 8px;
+    }
+
+    .control-center .widget-title button:hover {
+    	background-color: ${withHashtag.base02};
+    	color: ${withHashtag.base05};
+    }
+
+    .control-center .widget-title button:active {
+    	background-color: ${withHashtag.base03};
+    	color: ${withHashtag.base05};
+    }
+
+    .control-center .notification-row .notification-background {
+    	border-radius: 10px;
+    	background-color: ${withHashtag.base01};
+    	color: ${withHashtag.base05};
+    	margin-top: 14px;
+    }
+
+    .control-center .notification-row .notification-background .notification {
+    	padding: 7px;
+    	border-radius: 7px;
+    }
+
+    .control-center
+    	.notification-row
+    	.notification-background
+    	.notification
+    	.notification-content {
+    	margin: 7px;
+    }
+
+    .control-center
+    	.notification-row
+    	.notification-background
+    	.notification
+    	.notification-content
+    	.summary {
+    	color: ${withHashtag.base05};
+    }
+
+    .control-center
+    	.notification-row
+    	.notification-background
+    	.notification
+    	.notification-content
+    	.time {
+    	color: ${withHashtag.base04};
+    }
+
+    .control-center
+    	.notification-row
+    	.notification-background
+    	.notification
+    	.notification-content
+    	.body {
+    	color: ${withHashtag.base05};
+    }
+
+    .control-center
+    	.notification-row
+    	.notification-background
+    	.notification
+    	> *:last-child
+    	> * {
+    	min-height: 3.4em;
+    }
+
+    .control-center
+    	.notification-row
+    	.notification-background
+    	.notification
+    	> *:last-child
+    	> *
+    	.notification-action {
+    	border-radius: 7px;
+    	background-color: ${withHashtag.base00};
+    	color: ${withHashtag.base05};
+    	margin: 7px;
+    }
+
+    .control-center
+    	.notification-row
+    	.notification-background
+    	.notification
+    	> *:last-child
+    	> *
+    	.notification-action:hover {
+    	background-color: ${withHashtag.base01};;
+    	color: ${withHashtag.base05};
+    }
+
+    .control-center
+    	.notification-row
+    	.notification-background
+    	.notification
+    	> *:last-child
+    	> *
+    	.notification-action:active {
+    	background-color: ${withHashtag.blue};
+    	color: ${withHashtag.base05};
+    }
+
+    .control-center .notification-row .notification-background .close-button {
+    	margin: 7px;
+    	padding: 2px;
+    	border-radius: 6.3px;
+    	background-color: ${withHashtag.red};
+    	color: ${withHashtag.base00};
+    }
+
+    .control-center .notification-row .notification-background .close-button:hover {
+    	background-color: ${withHashtag.red};
+    	color: ${withHashtag.base00};
+    }
+
+    .control-center
+    	.notification-row
+    	.notification-background
+    	.close-button:active {
+    	background-color: ${withHashtag.red};
+    	color: ${withHashtag.base00};
+    }
+
+    .control-center .notification-row .notification-background:hover {
+    	background-color: ${withHashtag.base00};
+    	color: ${withHashtag.base05};
+    }
+
+    .control-center .notification-row .notification-background:active {
+    	background-color: ${withHashtag.blue};
+    	color: ${withHashtag.base05};
+    }
+
+    progressbar,
+    progress,
+    trough {
+    	border-radius: 12.6px;
+    }
+
+    .notification.critical progress {
+    	background-color: ${withHashtag.red};
+    }
+
+    .notification.low progress,
+    .notification.normal progress {
+    	background-color: ${withHashtag.blue};
+    }
+
+    trough {
+    	background-color: ${withHashtag.base00};
+    }
+
+    .control-center trough {
+    	background-color: ${withHashtag.base03};
+    }
+
+    .control-center-dnd {
+    	margin-top: 5px;
+    	border-radius: 8px;
+    	background: ${withHashtag.base00};
+    	border: 1px solid ${withHashtag.base03};
+    }
+
+    .control-center-dnd:checked {
+    	background: ${withHashtag.base00};
+    }
+
+    .control-center-dnd slider {
+    	background: ${withHashtag.base03};
+    	border-radius: 8px;
+    }
+
+    .widget-dnd {
+    	margin: 0px;
+    	font-size: 1.1rem;
+    }
+
+    .widget-dnd > switch {
+    	font-size: initial;
+    	border-radius: 8px;
+    	background: ${withHashtag.base00};
+    	border: 1px solid ${withHashtag.base03};
+    }
+
+    .widget-dnd > switch:checked {
+    	background: ${withHashtag.base00};
+    }
+
+    .widget-dnd > switch slider {
+    	background: ${withHashtag.base01};
+    	border-radius: 8px;
+    	border: 1px solid ${withHashtag.magenta};
+    }
+
+  '';
+}