diff --git a/build/helpers/render.js b/build/helpers/render.js index c6c9ebc..d0d7d58 100644 --- a/build/helpers/render.js +++ b/build/helpers/render.js @@ -11,6 +11,7 @@ const build = ( wallpaper, lockpaper, theme ) => { console.log( '\n=> Extracting colours' ); // Extract colour palette from chosen wallpaper using Color-Thief colorThief.getPalette( wallpaper ).then( palette => { + palette = util.removeUselessColours( palette ); // Define view options (for rendering with mustache) if ( theme === 'test' ) { palette = [ [ 255, 0, 0 ], [ 0, 255, 0 ], [ 0, 0, 255 ] ]; diff --git a/build/helpers/util.js b/build/helpers/util.js index c2ee602..c47fd3a 100644 --- a/build/helpers/util.js +++ b/build/helpers/util.js @@ -57,6 +57,22 @@ const renderColourAsRGBAHex = ( colour, ambiance ) => { return `rgba(${hexCol}${decimalToHex(ambiance)})`.toLowerCase(); } +const removeUselessColours = ( palette ) => { + const p = []; + for ( let i = 0; i < palette.length; i++ ) { + const luminance = calculateLuminance( palette[ i ] ); + if ( luminance < 215 && luminance > 40 ) { + p.push( palette[ i ] ); + } + } + + return p; +} + +const calculateLuminance = ( colour ) => { + return colour[ 0 ] + colour[ 1 ] + colour[ 2 ] / 3; +} + /* * Replace the colours with variable names @@ -149,5 +165,6 @@ module.exports = { renderColourAsRGBHex, renderColourAsRGBAHex, themePreProcessor, - getGradientColour + getGradientColour, + removeUselessColours } diff --git a/config/astal/util/colours.scss b/config/astal/util/colours.scss index 7ba48c0..985a374 100644 --- a/config/astal/util/colours.scss +++ b/config/astal/util/colours.scss @@ -1,5 +1,5 @@ $fg-color: #E6E6E6; $bg-color: #141414; -$accent-color: #B27BD1; -$accent-color-2: #5F50A6; +$accent-color: #530519; +$accent-color-2: #32050F; $shadow-color: rgba(40, 40, 40, 0.3); diff --git a/config/hypr/hyprland/colors.conf b/config/hypr/hyprland/colors.conf index 99d3071..986ae86 100644 --- a/config/hypr/hyprland/colors.conf +++ b/config/hypr/hyprland/colors.conf @@ -4,10 +4,10 @@ # ╰────────────────────────────────────────────────╯ # ──────────────────────────────────────────────────────────────────── -exec = swaybg -m fill -i /home/janis/NextCloud/Wallpapers/dark/colour-explosion.jpg +exec = swaybg -m fill -i /home/janis/NextCloud/Wallpapers/dark/mountains.jpg general { - col.active_border = rgba(b27bd1cc) rgba(5f50a6cc) rgba(050406cc) 45deg + col.active_border = rgba(530519cc) rgba(32050fcc) rgba(70444ccc) 45deg col.inactive_border = rgb(000000) } diff --git a/config/hypr/hyprlock.conf b/config/hypr/hyprlock.conf index 4e06d97..c7cd84d 100644 --- a/config/hypr/hyprlock.conf +++ b/config/hypr/hyprlock.conf @@ -18,7 +18,7 @@ general { # └ ┘ background { monitor = - path = /home/janis/NextCloud/Wallpapers/arch/arch-simple.jpg # Or screenshot + path = /home/janis/NextCloud/Wallpapers/dark/colour-explosion.jpg # Or screenshot blur_passes = 1 } @@ -33,7 +33,7 @@ input-field { dots_size = 0.33 # Scale of input-field height, 0.2 - 0.8 dots_spacing = 0.15 # Scale of dots' absolute size, 0.0 - 1.0 dots_center = false - outer_color = rgb(178, 123, 209) + outer_color = rgb(83, 5, 25) inner_color = rgb(200, 200, 200) font_color = rgb(10, 10, 10) fade_on_empty = true diff --git a/config/rofi/style.rasi b/config/rofi/style.rasi index fba61b7..1f50ad1 100644 --- a/config/rofi/style.rasi +++ b/config/rofi/style.rasi @@ -2,9 +2,9 @@ background: #141414; background-selected: #1E1E1E; foreground: #E6E6E6; - accent: #B27BD1; - accent-two: #5F50A6; - // border-color: #050406; + accent: #530519; + accent-two: #32050F; + // border-color: #70444C; inactive: #C8C8C8; spacing: 2; width: 30em; diff --git a/config/wlogout/style.css b/config/wlogout/style.css index a6561bc..e2e564b 100644 --- a/config/wlogout/style.css +++ b/config/wlogout/style.css @@ -22,11 +22,11 @@ button { } button:hover { - background-color: rgba(95, 80, 166, 0.5); + background-color: rgba(50, 5, 15, 0.5); } button:focus { - background-color: rgb(178, 123, 209); + background-color: rgb(83, 5, 25); color: rgb(230, 230, 230); } diff --git a/gtk-theme/dist/colours.css b/gtk-theme/dist/colours.css index 41988b2..1de427d 100644 --- a/gtk-theme/dist/colours.css +++ b/gtk-theme/dist/colours.css @@ -40,40 +40,40 @@ /* * ── Accent colour ──────────────────────────────────────────────────── */ -@define-color accent #B27BD1; -@define-color accent_rgba_05 rgba(178, 123, 209, 0.5); -@define-color accent_rgba_03 rgba(178, 123, 209, 0.3); -@define-color accent_rgba_02 rgba(178, 123, 209, 0.2); -@define-color accent_rgba_015 rgba(178, 123, 209, 0.15); -@define-color accent_rgba_011 rgba(178, 123, 209, 0.11); -@define-color accent_rgba_007 rgba(178, 123, 209, 0.07); +@define-color accent #530519; +@define-color accent_rgba_05 rgba(83, 5, 25, 0.5); +@define-color accent_rgba_03 rgba(83, 5, 25, 0.3); +@define-color accent_rgba_02 rgba(83, 5, 25, 0.2); +@define-color accent_rgba_015 rgba(83, 5, 25, 0.15); +@define-color accent_rgba_011 rgba(83, 5, 25, 0.11); +@define-color accent_rgba_007 rgba(83, 5, 25, 0.07); /* * ── Accent Gradient ────────────────────────────────────────────────── */ -@define-color accent_gradient_1 #724F86; -@define-color accent_gradient_2 #5B3F6B; -@define-color accent_gradient_3 #493256; -@define-color accent_gradient_4 #3A2844; -@define-color accent_gradient_5 #2F2037; -@define-color accent_gradient_inverse_1 #FFC0FF; -@define-color accent_gradient_inverse_2 #FFC0FF; -@define-color accent_gradient_inverse_3 #FFC0FF; +@define-color accent_gradient_1 #350310; +@define-color accent_gradient_2 #2A030D; +@define-color accent_gradient_3 #22020A; +@define-color accent_gradient_4 #1B0208; +@define-color accent_gradient_5 #160107; +@define-color accent_gradient_inverse_1 #820827; +@define-color accent_gradient_inverse_2 #820827; +@define-color accent_gradient_inverse_3 #820827; /* * ── Secondary accent colour ────────────────────────────────────────── */ -@define-color accent2 #5F50A6; -@define-color accent2_rgba_05 rgba(95, 80, 166, 0.5); -@define-color accent2_rgba_03 rgba(95, 80, 166, 0.3); -@define-color accent2_rgba_02 rgba(95, 80, 166, 0.2); -@define-color accent2_rgba_015 rgba(95, 80, 166, 0.15); -@define-color accent2_rgba_01 rgba(95, 80, 166, 0.1); +@define-color accent2 #32050F; +@define-color accent2_rgba_05 rgba(50, 5, 15, 0.5); +@define-color accent2_rgba_03 rgba(50, 5, 15, 0.3); +@define-color accent2_rgba_02 rgba(50, 5, 15, 0.2); +@define-color accent2_rgba_015 rgba(50, 5, 15, 0.15); +@define-color accent2_rgba_01 rgba(50, 5, 15, 0.1); /* * ── Tertiary accent colour ─────────────────────────────────────────── */ -@define-color accent3 #050406; +@define-color accent3 #70444C; /* * ── Inactive Colour ──────────────────────────────────────────────────