forked from
jollywhoppers.com/witchsky.app
Bluesky app fork with some witchin' additions 💫
feat: add cyan base color theme
+158
+4
src/alf/index.tsx
+4
src/alf/index.tsx
···
14
14
blackskyscheme,
15
15
blueskyscheme,
16
16
catppuccinscheme,
17
+
cyanscheme,
17
18
deerscheme,
18
19
evergardenscheme,
19
20
kittyscheme,
···
188
189
break
189
190
case 'evergarden':
190
191
currentScheme = evergardenscheme
192
+
break
193
+
case 'cyan base':
194
+
currentScheme = cyanscheme
191
195
break
192
196
case 'material3':
193
197
currentScheme = getMaterial3Colors(palette).scheme
+146
src/alf/themes.ts
+146
src/alf/themes.ts
···
643
643
dim: BLUESKY_THEMES.dim,
644
644
}
645
645
646
+
export const CYAN_PALETTE: Palette = {
647
+
white: STATIC_VALUES.white,
648
+
black: STATIC_VALUES.black,
649
+
pink: STATIC_VALUES.pink,
650
+
yellow: STATIC_VALUES.yellow,
651
+
like: STATIC_VALUES.pink,
652
+
653
+
contrast_0: '#FFFFFF',
654
+
contrast_25: '#F9FAFB',
655
+
contrast_50: '#EFF2F6',
656
+
contrast_100: '#DCE2EA',
657
+
contrast_200: '#C0CAD8',
658
+
contrast_300: '#A5B2C5',
659
+
contrast_400: '#8798B0',
660
+
contrast_500: '#667B99',
661
+
contrast_600: '#526580',
662
+
contrast_700: '#405168',
663
+
contrast_800: '#313F54',
664
+
contrast_900: '#232E3E',
665
+
contrast_950: '#19222E',
666
+
contrast_975: '#111822',
667
+
contrast_1000: '#000000',
668
+
669
+
primary_25: `hsl(174, 55%, 97%)`,
670
+
primary_50: `hsl(174, 55%, 95%)`,
671
+
primary_100: `hsl(174, 55%, 90%)`,
672
+
primary_200: `hsl(174, 55%, 80%)`,
673
+
primary_300: `hsl(174, 60%, 70%)`,
674
+
primary_400: `hsl(174, 72%, 58%)`,
675
+
primary_500: `hsl(174, 83%, 38%)`,
676
+
primary_600: `hsl(174, 78%, 32%)`,
677
+
primary_700: `hsl(174, 72%, 26%)`,
678
+
primary_800: `hsl(174, 66%, 20%)`,
679
+
primary_900: `hsl(174, 60%, 15%)`,
680
+
primary_950: `hsl(174, 55%, 10%)`,
681
+
primary_975: `hsl(174, 55%, 6%)`,
682
+
683
+
positive_25: '#ECFEF5',
684
+
positive_50: '#D3FDE8',
685
+
positive_100: '#A3FACF',
686
+
positive_200: '#6AF6B0',
687
+
positive_300: '#2CF28F',
688
+
positive_400: '#0DD370',
689
+
positive_500: '#09B35E',
690
+
positive_600: '#04904A',
691
+
positive_700: '#036D38',
692
+
positive_800: '#04522B',
693
+
positive_900: '#033F21',
694
+
positive_950: '#032A17',
695
+
positive_975: '#021D0F',
696
+
697
+
negative_25: '#FFF5F7',
698
+
negative_50: '#FEE7EC',
699
+
negative_100: '#FDD3DD',
700
+
negative_200: '#FBBBCA',
701
+
negative_300: '#F891A9',
702
+
negative_400: '#F65A7F',
703
+
negative_500: '#E91646',
704
+
negative_600: '#CA123D',
705
+
negative_700: '#A71134',
706
+
negative_800: '#7F0B26',
707
+
negative_900: '#5F071C',
708
+
negative_950: '#430413',
709
+
negative_975: '#30030D',
710
+
}
711
+
712
+
export const CYAN_SUBDUED_PALETTE: Palette = {
713
+
white: STATIC_VALUES.white,
714
+
black: STATIC_VALUES.black,
715
+
pink: STATIC_VALUES.pink,
716
+
yellow: STATIC_VALUES.yellow,
717
+
like: STATIC_VALUES.pink,
718
+
719
+
contrast_0: '#FFFFFF',
720
+
contrast_25: '#F9FAFB',
721
+
contrast_50: '#F2F4F8',
722
+
contrast_100: '#E2E7EE',
723
+
contrast_200: '#C3CDDA',
724
+
contrast_300: '#ABB8C9',
725
+
contrast_400: '#8D9DB4',
726
+
contrast_500: '#6F839F',
727
+
contrast_600: '#586C89',
728
+
contrast_700: '#485B75',
729
+
contrast_800: '#394A58',
730
+
contrast_900: '#2C3D4C',
731
+
contrast_950: '#22323D',
732
+
contrast_975: '#1C2B35',
733
+
contrast_1000: '#15232C',
734
+
735
+
primary_25: `hsl(174, 35%, 97%)`,
736
+
primary_50: `hsl(174, 35%, 95%)`,
737
+
primary_100: `hsl(174, 35%, 90%)`,
738
+
primary_200: `hsl(174, 35%, 80%)`,
739
+
primary_300: `hsl(174, 40%, 70%)`,
740
+
primary_400: `hsl(174, 50%, 58%)`,
741
+
primary_500: `hsl(174, 58%, 38%)`,
742
+
primary_600: `hsl(174, 54%, 32%)`,
743
+
primary_700: `hsl(174, 50%, 26%)`,
744
+
primary_800: `hsl(174, 46%, 20%)`,
745
+
primary_900: `hsl(174, 42%, 15%)`,
746
+
primary_950: `hsl(174, 40%, 10%)`,
747
+
primary_975: `hsl(174, 40%, 6%)`,
748
+
749
+
positive_25: '#ECFEF5',
750
+
positive_50: '#D8FDEB',
751
+
positive_100: '#A8FAD1',
752
+
positive_200: '#6FF6B3',
753
+
positive_300: '#31F291',
754
+
positive_400: '#0EDD75',
755
+
positive_500: '#0AC266',
756
+
positive_600: '#049F52',
757
+
positive_700: '#038142',
758
+
positive_800: '#056636',
759
+
positive_900: '#04522B',
760
+
positive_950: '#053D21',
761
+
positive_975: '#052917',
762
+
763
+
negative_25: '#FFF5F7',
764
+
negative_50: '#FEEBEF',
765
+
negative_100: '#FDD8E1',
766
+
negative_200: '#FCC0CE',
767
+
negative_300: '#F99AB0',
768
+
negative_400: '#F76486',
769
+
negative_500: '#EB2452',
770
+
negative_600: '#D81341',
771
+
negative_700: '#BA1239',
772
+
negative_800: '#910D2C',
773
+
negative_900: '#6F0B22',
774
+
negative_950: '#500B1C',
775
+
negative_975: '#3E0915',
776
+
}
777
+
778
+
const CYAN_THEMES = createThemes({
779
+
defaultPalette: CYAN_PALETTE,
780
+
subduedPalette: CYAN_SUBDUED_PALETTE,
781
+
})
782
+
783
+
export const cyanscheme = {
784
+
lightPalette: CYAN_THEMES.light.palette,
785
+
darkPalette: CYAN_THEMES.dark.palette,
786
+
dimPalette: CYAN_THEMES.dim.palette,
787
+
light: CYAN_THEMES.light,
788
+
dark: CYAN_THEMES.dark,
789
+
dim: CYAN_THEMES.dim,
790
+
}
791
+
646
792
export const DEER_PALETTE: Palette = {
647
793
white: `hsl(${DEER_BLUE_HUE}, 20%, ${DEER_defaultScale[14]}%)`,
648
794
black: STATIC_VALUES.black,