Skip to content

Instantly share code, notes, and snippets.

@Elorucov

Elorucov/vkcom_palette.css

Last active September 26, 2025 07:50
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save Elorucov/2bcecf362927d36c2193e04338f7f7cc to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save Elorucov/2bcecf362927d36c2193e04338f7f7cc to your computer and use it in GitHub Desktop.
Download ZIP
vk.com palette and color schemes (summer 2023, before migrating to VKUI tokens)
Raw
vkcom_palette.css
:root {
--azure_a100: #0077ff;
--azure_300: #397dcc;
--azure_a400: #2a6fbd;
--azure_a500: #2363aa;
--black: #000000;
--black_alpha4: rgba(0, 0, 0, 0.04);
--black_alpha8: rgba(0, 0, 0, 0.08);
--black_alpha12: rgba(0, 0, 0, 0.12);
--black_alpha16: rgba(0, 0, 0, 0.16);
--black_alpha24: rgba(0, 0, 0, 0.24);
--black_alpha36: rgba(0, 0, 0, 0.36);
--black_alpha40: rgba(0, 0, 0, 0.40);
--black_alpha48: rgba(0, 0, 0, 0.48);
--black_alpha56: rgba(0, 0, 0, 0.56);
--black_alpha72: rgba(0, 0, 0, 0.72);
--black_alpha88: rgba(0, 0, 0, 0.88);
--black_blue10: #000c1a;
--black_blue24: #001c3d;
--black_blue24_alpha8: rgba(0, 28, 61, 0.08);
--black_blue24_alpha24: rgba(0, 28, 61, 0.24);
--black_blue30_alpha66: rgba(0, 36, 77, 0.66);
--black_blue45_alpha10: rgba(0, 57, 115, 0.10);
--blue_400: #5181b8;
--blue_a400: #447bba;
--blue_400_alpha20: rgba(81, 129, 184, 0.20);
--blue_400_alpha48: rgba(81, 129, 184, 0.49);
--blue_420: #4a76a8;
--blue_550: #346297;
--blue_600: #2a5885;
--blue_640: #224b7a;
--blue_800: #1d3a5c;
--blue_980_alpha12: rgba(0, 20, 51, 0.12);
--blue_bright: #5c9ce6;
--brown_gold: #9e8f72;
--brown_light: #c2b79f;
--gold_200: #f4e7c3;
--gold_250: #e3d3ac;
--gold_300: #d1c097;
--gold_400: #ab9871;
--gold_500: #857250;
--gray_20: #f9f9f9;
--gray_40: #f5f5f5;
--gray_70: #555555;
--gray_100: #e1e3e6;
--gray_100_alpha60: rgba(225, 227, 230, 0.60);
--gray_200: #cccccc;
--gray_300: #b2b2b2;
--gray_400: #939393;
--gray_500: #828282;
--gray_600: #656565;
--gray_700: #555555;
--gray_700_alpha60: rgba(85, 85, 85, 0.60);
--gray_750: #424242;
--gray_800: #333333;
--gray_800_alpha72: rgba(51, 51, 51, 0.72);
--gray_800_alpha88: rgba(51, 51, 51, 0.88);
--gray_850: #292929;
--gray_900: #222222;
--gray_900_alpha16: rgba(34, 34, 34, 0.16);
--gray_900_alpha72: rgba(34, 34, 34, 0.72);
--gray_900_alpha88: rgba(34, 34, 34, 0.88);
--gray_940: #141414;
--gray_960: #0a0a0a;
--green_alpha16: rgba(75, 179, 75, 0.16);
--green_350: #4bb34b;
--green_400: #43a843;
--green_600: #1b7a1b;
--green_light: #def0d3;
--green_nice: #3dcc4b;
--light_blue_40: #e5ebf1;
--light_blue_40_alpha72: rgba(229, 235, 241, 0.72);
--light_blue_80: #dfe6ed;
--light_blue_100: #dae2ea;
--light_blue_300: #9eb4c8;
--light_blue_400: #7996b2;
--light_blue_500: #577ca1;
--light_blue_700: #45688e;
--light_blue_A300: #8fadc8;
--neon_pink: #f45fff;
--orange: #ffa000;
--orange_tint: #f9b54f;
--orange_light: #ffc062;
--orange_fire: #f05c44;
--orange_prominent: #ff724c;
--raspberry_pink: #e03fab;
--raspberry_pink_light: #f060c0;
--purple: #735ce6;
--purple_light: #937ff5;
--pink: #e6457a;
--pink_light: #faebeb;
--red: #e64646;
--red_alpha16: rgba(230, 70, 70, 0.16);
--red_alpha12: rgba(230, 70, 70, 0.12);
--red_dark: #db3b3b;
--red_light: #ff5c5c;
--red_nice: #ff3347;
--sky_60: #cce9ff;
--sky_80: #b2deff;
--sky_100: #99d3ff;
--sky_200: #70c1ff;
--sky_300: #71aaeb;
--steel_gray_10: #fafbfc;
--steel_gray_20: #f7f8fa;
--steel_gray_40: #f0f2f5;
--steel_gray_50: #eeeff1;
--steel_gray_60: #edeef0;
--steel_gray_80: #e7e8ec;
--steel_gray_100: #dce1e6;
--steel_gray_120: #d3d9de;
--steel_gray_140: #c5d0db;
--steel_gray_200: #aeb7c2;
--steel_gray_200_alpha12: rgba(174, 183, 194, 0.12);
--steel_gray_200_alpha16: rgba(174, 183, 194, 0.16);
--steel_gray_300: #99a2ad;
--steel_gray_400: #818c99;
--steel_gray_500: #6f7985;
--steel_gray_540: #626d7a;
--steel_gray_600: #4e5966;
--steel_gray_A540: #55677d;
--steel_gray_A540_alpha64: rgba(85, 103, 125, 0.64);
--transparent_black: rgba(0, 0, 0, 0.00);
--transparent_white: rgba(255, 255, 255, 0.00);
--turquoise: #63b9ba;
--violet: #792ec0;
--violet_dark: #1f1b2c;
--violet_light: #a393f5;
--violet_muted: #4b4d61;
--white: #ffffff;
--white_alpha72: rgba(255, 255, 255, 0.72);
--white_alpha64: rgba(255, 255, 255, 0.64);
--white_alpha48: rgba(255, 255, 255, 0.48);
--white_alpha40: rgba(255, 255, 255, 0.40);
--white_alpha24: rgba(255, 255, 255, 0.24);
--white_alpha16: rgba(255, 255, 255, 0.16);
--white_alpha12: rgba(255, 255, 255, 0.12);
--white_alpha8: rgba(255, 255, 255, 0.08);
--white_alpha4: rgba(255, 255, 255, 0.04);
--white_blue20: #cce4ff;
--white_blue32: #add3ff;
--yellow: #ffc107;
--yellow_light: #faefd2;
--yellow_alpha16: rgba(255, 202, 99, 0.16);
--yellow_overlight: #fff2d6;
--lavender_100: #e6e9ff;
--lavender_200: #ccd3ff;
--lavender_300: #adb8ff;
--lavender_700: #5965b3;
--lavender_800: #404980;
--lavender_900: #262b4d
}
/* Default/light theme */
:root {
--accent: var(--blue_a400);
--accent_alternate: var(--azure_a100);
--action_sheet_action_foreground: var(--blue_a400);
--action_sheet_separator: var(--black_alpha12);
--activity_indicator_tint: var(--steel_gray_200);
--attach_picker_tab_active_background: var(--blue_a400);
--attach_picker_tab_active_icon: var(--white);
--attach_picker_tab_active_text: var(--blue_a400);
--attach_picker_tab_inactive_background: var(--gray_40);
--attach_picker_tab_inactive_icon: var(--steel_gray_400);
--attach_picker_tab_inactive_text: var(--steel_gray_400);
--background_content: var(--white);
--background_hover: var(--steel_gray_200_alpha12);
--background_highlighted: var(--steel_gray_200_alpha16);
--background_keyboard: var(--steel_gray_100);
--background_light: var(--steel_gray_10);
--background_page: var(--steel_gray_60);
--background_suggestions: var(--white);
--button_bot_shadow: var(--gray_200);
--button_commerce_background: var(--green_350);
--button_commerce_foreground: var(--white);
--button_muted_background: var(--light_blue_40);
--button_muted_foreground: var(--blue_550);
--button_outline_border: var(--blue_550);
--button_outline_foreground: var(--blue_550);
--button_primary_background: var(--blue_a400);
--button_primary_foreground: var(--white);
--button_secondary_background: var(--light_blue_40);
--button_secondary_background_highlighted: var(--light_blue_100);
--button_secondary_foreground: var(--blue_550);
--button_secondary_foreground_highlighted: var(--blue_640);
--button_secondary_destructive_background: var(--red_alpha16);
--button_secondary_destructive_background_highlighted: var(--red_alpha12);
--button_secondary_destructive_foreground: var(--red);
--button_secondary_destructive_foreground_highlighted: var(--red_alpha12);
--button_tertiary_background: var(--transparent_black);
--button_tertiary_foreground: var(--blue_550);
--cell_button_foreground: var(--blue_550);
--content_placeholder_icon: var(--steel_gray_300);
--content_placeholder_text: var(--steel_gray_400);
--content_tint_background: var(--steel_gray_40);
--content_tint_background__transparent: rgba(240, 242, 245, 0);
--content_tint_foreground: var(--gray_500);
--control_background: var(--steel_gray_60);
--control_background_secondary: var(--white);
--control_foreground: var(--blue_a400);
--control_tint: var(--white);
--control_tint_muted: var(--gray_500);
--counter_primary_background: var(--blue_a400);
--counter_primary_text: var(--white);
--counter_prominent_background: var(--red_nice);
--counter_prominent_text: var(--white);
--counter_secondary_background: var(--steel_gray_300);
--counter_secondary_text: var(--white);
--content_warning_background: var(--yellow_light);
--destructive: var(--red);
--field_background: var(--steel_gray_20);
--field_border: var(--steel_gray_100);
--field_error_background: var(--pink_light);
--field_error_border: var(--red);
--field_valid_border: var(--green_350);
--field_text_placeholder: var(--steel_gray_400);
--float_button_background: var(--steel_gray_20);
--float_button_background_highlighted: var(--steel_gray_60);
--float_button_foreground: var(--steel_gray_300);
--float_button_border: var(--black_alpha8);
--header_alternate_background: var(--white);
--header_alternate_tab_active_indicator: var(--blue_a400);
--header_alternate_tab_active_text: var(--black);
--header_alternate_tab_inactive_text: var(--steel_gray_300);
--header_background: var(--white);
--header_background_before_blur: var(--white);
--header_background_before_blur_alternate: var(--white);
--header_search_field_background: var(--steel_gray_60);
--header_search_field_tint: var(--steel_gray_400);
--header_tab_active_background: var(--transparent_black);
--header_tab_active_text: var(--black);
--header_tab_active_indicator: var(--azure_300);
--header_tab_inactive_text: var(--steel_gray_300);
--header_text: var(--black);
--header_text_alternate: var(--black);
--header_text_secondary: var(--steel_gray_400);
--header_tint: var(--steel_gray_200);
--header_tint_alternate: var(--blue_a400);
--icon_alpha_placeholder: var(--white);
--icon_medium: var(--steel_gray_500);
--icon_medium_alpha: var(--black_alpha48);
--icon_outline_medium: var(--steel_gray_400);
--icon_outline_secondary: var(--steel_gray_300);
--icon_secondary: var(--steel_gray_300);
--icon_secondary_alpha: var(--black_alpha36);
--icon_tertiary: var(--steel_gray_200);
--icon_tertiary_alpha: var(--black_alpha24);
--im_attach_tint: var(--blue_a400);
--im_bubble_border_alternate: var(--steel_gray_100);
--im_bubble_border_alternate_highlighted: var(--gray_200);
--im_bubble_button_background: var(--steel_gray_20);
--im_bubble_button_outgoing_background: var(--white_alpha72);
--im_bubble_button_background_highlighted: var(--gray_200);
--im_bubble_button_foreground: var(--black);
--im_bubble_incoming_expiring: var(--lavender_100);
--im_bubble_incoming_expiring_highlighted: var(--lavender_200);
--im_bubble_outgoing_expiring: var(--lavender_200);
--im_bubble_outgoing_expiring_highlighted: var(--lavender_300);
--im_bubble_incoming: var(--steel_gray_60);
--im_bubble_incoming_alternate: var(--white);
--im_bubble_incoming_alternate_highlighted: var(--steel_gray_20);
--im_bubble_incoming_highlighted: var(--steel_gray_120);
--im_bubble_gift_background: var(--gold_200);
--im_bubble_gift_background_highlighted: var(--gold_250);
--im_bubble_gift_text: var(--gold_500);
--im_bubble_gift_text_secondary: var(--gold_400);
--im_bubble_outgoing: var(--white_blue20);
--im_bubble_outgoing_alternate: var(--white);
--im_bubble_outgoing_highlighted: var(--white_blue32);
--im_bubble_outgoing_alternate_highlighted: var(--steel_gray_40);
--im_bubble_wallpaper_button_background: var(--steel_gray_40);
--im_bubble_wallpaper_button_background_highlighted: var(--steel_gray_80);
--im_bubble_wallpaper_button_foreground: var(--black);
--im_bubble_wallpaper_incoming: var(--white);
--im_bubble_wallpaper_incoming_highlighted: var(--steel_gray_60);
--im_bubble_wallpaper_outgoing: var(--white_blue20);
--im_bubble_wallpaper_outgoing_highlighted: var(--white_blue32);
--im_forward_line_tint: var(--blue_980_alpha12);
--im_reply_separator: var(--blue_600);
--im_text_name: var(--blue_600);
--im_toolbar_voice_msg_background: var(--steel_gray_300);
--im_toolbar_separator: var(--black_blue24);
--image_border: var(--black_alpha8);
--input_background: var(--white);
--input_border: var(--steel_gray_120);
--landing_background: var(--white);
--landing_field_background: var(--steel_gray_20);
--landing_field_border: var(--transparent_black);
--landing_field_placeholder: var(--steel_gray_400);
--landing_login_button_background: var(--blue_a400);
--landing_login_button_foreground: var(--white);
--landing_primary_button_background: var(--blue_a400);
--landing_primary_button_foreground: var(--white);
--landing_tertiary_button_background: var(--transparent_black);
--landing_tertiary_button_foreground: var(--blue_a400);
--landing_text_primary: var(--black);
--landing_text_title: var(--blue_a400);
--landing_text_secondary: var(--steel_gray_400);
--landing_secondary_button_background: var(--black_blue45_alpha10);
--landing_secondary_button_foreground: var(--blue_a400);
--landing_snippet_border: var(--black_alpha12);
--like_text_tint: var(--red_nice);
--link_alternate: var(--blue_600);
--loader_background: var(--steel_gray_60);
--loader_tint: var(--steel_gray_140);
--loader_track_fill: var(--steel_gray_120);
--loader_track_value_fill: var(--blue_a400);
--media_overlay_button_background: var(--white);
--media_overlay_button_foreground: var(--gray_800);
--modal_card_background: var(--white);
--modal_card_background__transparent: rgba(255, 255, 255, 0);
--modal_card_border: var(--transparent_black);
--modal_card_header_close: var(--black);
--music_playback_icon: var(--black);
--feed_recommended_friend_promo_background: var(--blue_a400);
--overlay_status_background: var(--steel_gray_60);
--overlay_status_foreground: var(--steel_gray_500);
--overlay_status_icon: var(--steel_gray_400);
--placeholder_icon_background: var(--black_blue24_alpha8);
--placeholder_icon_background_opaque: var(--steel_gray_40);
--placeholder_icon_foreground_primary: var(--steel_gray_300);
--placeholder_icon_foreground_secondary: var(--steel_gray_200);
--placeholder_icon_tint: var(--blue_800);
--poll_option_background: var(--blue_a400);
--search_bar_background: var(--transparent_black);
--search_bar_field_background: var(--steel_gray_60);
--search_bar_field_tint: var(--steel_gray_400);
--search_bar_segmented_control_tint: var(--steel_gray_400);
--segmented_control_bar_background: var(--transparent_black);
--segmented_control_tint: var(--steel_gray_300);
--selection_off_icon: var(--steel_gray_140);
--separator_alpha: var(--black_alpha12);
--separator_alternate: var(--steel_gray_80);
--separator_common: var(--steel_gray_100);
--snippet_background: var(--white);
--snippet_border: var(--black_alpha12);
--snippet_icon_tertiary: var(--steel_gray_200);
--splashscreen_icon: var(--steel_gray_100);
--statusbar_alternate_legacy_background: var(--black_alpha24);
--stories_create_button_background_from: var(--steel_gray_40);
--stories_create_button_background_to: var(--steel_gray_100);
--stories_create_button_foreground: var(--steel_gray_500);
--stories_skeleton_loader_background: var(--gray_200);
--switch_ios_off_border: var(--steel_gray_100);
--stories_create_button_icon_background: var(--white);
--tabbar_active_icon: var(--blue_a400);
--tabbar_background: var(--steel_gray_20);
--tabbar_inactive_icon: var(--steel_gray_300);
--tabbar_tablet_active_icon: var(--blue_a400);
--tabbar_tablet_background: var(--steel_gray_20);
--tabbar_tablet_inactive_icon: var(--steel_gray_300);
--tabbar_tablet_text_primary: var(--black);
--tabbar_tablet_text_secondary: var(--steel_gray_400);
--toolbar_attach_background_from: var(--steel_gray_100);
--toolbar_attach_background_to: var(--steel_gray_200);
--text_action_counter: var(--steel_gray_400);
--text_link: var(--blue_600);
--text_link_highlighted_background: var(--black);
--text_muted: var(--gray_800);
--text_name: var(--blue_600);
--text_placeholder: var(--steel_gray_400);
--text_primary: var(--black);
--text_secondary: var(--steel_gray_400);
--text_subhead: var(--steel_gray_540);
--text_tertiary: var(--steel_gray_300);
--icon_name: var(--light_blue_A300);
--panel_tab_active_background: var(--steel_gray_60);
--panel_tab_active_text: var(--steel_gray_600);
--panel_tab_inactive_text: var(--steel_gray_500);
--im_service_message_text: var(--steel_gray_400);
--writebar_icon: var(--steel_gray_400);
--dynamic_blue: var(--blue_400);
--dynamic_gray: var(--steel_gray_200);
--dynamic_red: var(--red_nice);
--dynamic_green: var(--green_600);
--dynamic_orange: var(--orange);
--dynamic_orange_peach: var(--orange_tint);
--dynamic_purple: var(--purple);
--dynamic_violet: var(--violet);
--dynamic_raspberry_pink: var(--raspberry_pink);
--dynamic_neon_pink: var(--neon_pink);
--vk_connect_button_primary_background: var(--gray_900);
--vk_connect_button_primary_foreground: var(--white);
--vk_connect_button_secondary_background: var(--gray_40);
--vk_connect_button_secondary_foreground: var(--gray_900);
--background_text_highlighted: var(--blue_400_alpha20);
--skeleton_shimmer_from: var(--white);
--skeleton_shimmer_to: var(--transparent_white);
--skeleton_foreground_from: var(--steel_gray_40);
--skeleton_foreground_to: var(--steel_gray_80);
--primary_overlay_badge: var(--black_alpha56);
--secondary_overlay_badge: var(--black_alpha24);
--content_positive_background: var(--green_light);
--content_negative_background: var(--pink_light);
--vk_donut_background: var(--yellow_overlight)
}
/* Dark theme */
@media (prefers-color-scheme: dark) {
:root {
--accent: var(--sky_300);
--accent_alternate: var(--white);
--action_sheet_action_foreground: var(--white);
--action_sheet_separator: var(--white_alpha16);
--activity_indicator_tint: var(--gray_600);
--attach_picker_tab_active_background: var(--gray_100);
--attach_picker_tab_active_icon: var(--gray_900);
--attach_picker_tab_active_text: var(--gray_100);
--attach_picker_tab_inactive_background: var(--gray_800);
--attach_picker_tab_inactive_icon: var(--gray_100);
--attach_picker_tab_inactive_text: var(--gray_500);
--background_content: var(--gray_900);
--background_hover: var(--white_alpha8);
--background_highlighted: var(--white_alpha8);
--background_keyboard: var(--gray_800);
--background_light: var(--gray_850);
--background_page: var(--gray_940);
--background_suggestions: var(--gray_800);
--button_bot_shadow: var(--gray_900);
--button_commerce_background: var(--green_350);
--button_commerce_foreground: var(--white);
--button_muted_background: var(--gray_800);
--button_muted_foreground: var(--gray_100);
--button_outline_border: var(--gray_100);
--button_outline_foreground: var(--gray_100);
--button_primary_background: var(--gray_100);
--button_primary_foreground: var(--gray_900);
--button_secondary_background: var(--gray_750);
--button_secondary_background_highlighted: var(--gray_700);
--button_secondary_foreground: var(--gray_100);
--button_secondary_foreground_highlighted: var(--gray_100);
--button_secondary_destructive_background: var(--gray_700);
--button_secondary_destructive_background_highlighted: var(--gray_700_alpha60);
--button_secondary_destructive_foreground: var(--red_light);
--button_secondary_destructive_foreground_highlighted: var(--red_alpha16);
--button_tertiary_background: var(--transparent_black);
--button_tertiary_foreground: var(--gray_100);
--cell_button_foreground: var(--gray_100);
--content_placeholder_icon: var(--gray_300);
--content_placeholder_text: var(--gray_300);
--content_tint_background: var(--gray_800);
--content_tint_background__transparent: rgba(51, 51, 51, 0);
--content_tint_foreground: var(--gray_400);
--control_background: var(--gray_700);
--control_background_secondary: var(--gray_500);
--control_foreground: var(--gray_100);
--control_tint: var(--gray_900);
--control_tint_muted: var(--gray_400);
--counter_primary_background: var(--white);
--counter_primary_text: var(--gray_900);
--counter_prominent_background: var(--red_nice);
--counter_prominent_text: var(--white);
--counter_secondary_background: var(--gray_500);
--counter_secondary_text: var(--gray_900);
--content_warning_background: var(--yellow_alpha16);
--destructive: var(--red_light);
--field_background: var(--gray_850);
--field_border: var(--gray_750);
--field_error_background: var(--red_alpha16);
--field_error_border: var(--red);
--field_valid_border: var(--green_350);
--field_text_placeholder: var(--gray_500);
--float_button_background: var(--gray_700);
--float_button_background_highlighted: var(--gray_600);
--float_button_foreground: var(--gray_300);
--float_button_border: var(--black_alpha12);
--header_alternate_background: var(--gray_800);
--header_alternate_tab_active_indicator: var(--gray_100);
--header_alternate_tab_active_text: var(--gray_100);
--header_alternate_tab_inactive_text: var(--gray_500);
--header_background: var(--gray_900);
--header_background_before_blur: var(--gray_960);
--header_background_before_blur_alternate: var(--gray_960);
--header_search_field_background: var(--gray_750);
--header_search_field_tint: var(--gray_300);
--header_tab_active_background: var(--gray_600);
--header_tab_active_text: var(--gray_100);
--header_tab_active_indicator: var(--azure_300);
--header_tab_inactive_text: var(--gray_500);
--header_text: var(--gray_100);
--header_text_alternate: var(--gray_100);
--header_text_secondary: var(--white_alpha64);
--header_tint: var(--gray_100);
--header_tint_alternate: var(--white);
--icon_alpha_placeholder: var(--gray_100);
--icon_medium: var(--gray_400);
--icon_medium_alpha: var(--white_alpha48);
--icon_outline_medium: var(--gray_300);
--icon_outline_secondary: var(--gray_400);
--icon_secondary: var(--gray_500);
--icon_secondary_alpha: var(--white_alpha40);
--icon_tertiary: var(--gray_600);
--icon_tertiary_alpha: var(--white_alpha24);
--im_attach_tint: var(--white);
--im_bubble_border_alternate: var(--transparent_black);
--im_bubble_border_alternate_highlighted: var(--transparent_black);
--im_bubble_button_background: var(--white_alpha16);
--im_bubble_button_outgoing_background: var(--white_alpha24);
--im_bubble_button_background_highlighted: var(--white_alpha24);
--im_bubble_button_foreground: var(--gray_100);
--im_bubble_incoming_expiring: var(--lavender_900);
--im_bubble_incoming_expiring_highlighted: var(--lavender_800);
--im_bubble_outgoing_expiring: var(--lavender_800);
--im_bubble_outgoing_expiring_highlighted: var(--lavender_700);
--im_bubble_incoming: var(--gray_800);
--im_bubble_incoming_alternate: var(--gray_800);
--im_bubble_incoming_alternate_highlighted: var(--gray_600);
--im_bubble_incoming_highlighted: var(--gray_600);
--im_bubble_gift_background: var(--gold_500);
--im_bubble_gift_background_highlighted: var(--gold_400);
--im_bubble_gift_text: var(--white);
--im_bubble_gift_text_secondary: var(--gold_250);
--im_bubble_outgoing: var(--gray_700);
--im_bubble_outgoing_alternate: var(--gray_700);
--im_bubble_outgoing_highlighted: var(--gray_600);
--im_bubble_outgoing_alternate_highlighted: var(--gray_500);
--im_bubble_wallpaper_button_background: var(--gray_700);
--im_bubble_wallpaper_button_background_highlighted: var(--gray_500);
--im_bubble_wallpaper_button_foreground: var(--gray_100);
--im_bubble_wallpaper_incoming: var(--gray_800);
--im_bubble_wallpaper_incoming_highlighted: var(--gray_600);
--im_bubble_wallpaper_outgoing: var(--gray_700);
--im_bubble_wallpaper_outgoing_highlighted: var(--gray_600);
--im_forward_line_tint: var(--white_alpha24);
--im_reply_separator: var(--white);
--im_text_name: var(--sky_300);
--im_toolbar_voice_msg_background: var(--gray_700);
--im_toolbar_separator: var(--gray_300);
--image_border: var(--white_alpha8);
--input_background: var(--gray_750);
--input_border: var(--gray_700);
--landing_background: var(--gray_900);
--landing_field_background: var(--gray_850);
--landing_field_border: var(--transparent_black);
--landing_field_placeholder: var(--gray_300);
--landing_login_button_background: var(--gray_100);
--landing_login_button_foreground: var(--gray_900);
--landing_primary_button_background: var(--gray_100);
--landing_primary_button_foreground: var(--gray_900);
--landing_tertiary_button_background: var(--transparent_black);
--landing_tertiary_button_foreground: var(--white);
--landing_text_primary: var(--gray_100);
--landing_text_title: var(--white);
--landing_text_secondary: var(--gray_500);
--landing_secondary_button_background: var(--white_alpha16);
--landing_secondary_button_foreground: var(--white);
--landing_snippet_border: var(--white_alpha16);
--like_text_tint: var(--red_light);
--link_alternate: var(--gray_400);
--loader_background: var(--gray_700);
--loader_tint: var(--gray_500);
--loader_track_fill: var(--gray_500);
--loader_track_value_fill: var(--white);
--media_overlay_button_background: var(--white);
--media_overlay_button_foreground: var(--gray_800);
--modal_card_background: var(--gray_850);
--modal_card_background__transparent: rgba(41, 41, 41, 0);
--modal_card_border: var(--white_alpha12);
--modal_card_header_close: var(--white);
--music_playback_icon: var(--white);
--feed_recommended_friend_promo_background: var(--steel_gray_500);
--overlay_status_background: var(--gray_900);
--overlay_status_foreground: var(--gray_100);
--overlay_status_icon: var(--steel_gray_60);
--placeholder_icon_background: var(--white_alpha8);
--placeholder_icon_background_opaque: var(--gray_850);
--placeholder_icon_foreground_primary: var(--gray_400);
--placeholder_icon_foreground_secondary: var(--gray_600);
--placeholder_icon_tint: var(--white);
--poll_option_background: var(--white);
--search_bar_background: var(--gray_900);
--search_bar_field_background: var(--gray_750);
--search_bar_field_tint: var(--gray_300);
--search_bar_segmented_control_tint: var(--gray_400);
--segmented_control_bar_background: var(--gray_900);
--segmented_control_tint: var(--gray_500);
--selection_off_icon: var(--gray_600);
--separator_alpha: var(--white_alpha16);
--separator_alternate: var(--gray_850);
--separator_common: var(--gray_750);
--snippet_background: var(--white_alpha4);
--snippet_border: var(--white_alpha16);
--snippet_icon_tertiary: var(--gray_600);
--splashscreen_icon: var(--gray_800);
--statusbar_alternate_legacy_background: var(--transparent_black);
--stories_create_button_background_from: var(--gray_750);
--stories_create_button_background_to: var(--gray_750);
--stories_create_button_foreground: var(--gray_200);
--stories_skeleton_loader_background: var(--gray_700);
--stories_create_button_icon_background: var(--gray_700);
--switch_ios_off_border: var(--gray_800);
--tabbar_active_icon: var(--white);
--tabbar_background: var(--gray_800);
--tabbar_inactive_icon: var(--gray_500);
--tabbar_tablet_active_icon: var(--azure_300);
--tabbar_tablet_background: var(--gray_850);
--tabbar_tablet_inactive_icon: var(--gray_500);
--tabbar_tablet_text_primary: var(--gray_100);
--tabbar_tablet_text_secondary: var(--gray_500);
--toolbar_attach_background_from: var(--gray_500);
--toolbar_attach_background_to: var(--gray_600);
--text_action_counter: var(--gray_300);
--text_link: var(--sky_300);
--text_link_highlighted_background: var(--azure_300);
--text_muted: var(--gray_200);
--text_name: var(--gray_100);
--text_placeholder: var(--gray_300);
--text_primary: var(--gray_100);
--text_secondary: var(--gray_500);
--text_subhead: var(--gray_400);
--text_tertiary: var(--gray_600);
--icon_name: var(--gray_300);
--panel_tab_active_background: var(--gray_700);
--panel_tab_active_text: var(--gray_100);
--panel_tab_inactive_text: var(--gray_500);
--im_service_message_text: var(--gray_500);
--writebar_icon: var(--gray_100);
--dynamic_blue: var(--azure_300);
--dynamic_gray: var(--steel_gray_200);
--dynamic_red: var(--red_nice);
--dynamic_green: var(--green_350);
--dynamic_orange: var(--orange);
--dynamic_orange_peach: var(--orange_light);
--dynamic_purple: var(--purple_light);
--dynamic_violet: var(--violet_light);
--dynamic_raspberry_pink: var(--raspberry_pink_light);
--dynamic_neon_pink: var(--neon_pink);
--vk_connect_button_primary_background: var(--gray_100);
--vk_connect_button_primary_foreground: var(--gray_900);
--vk_connect_button_secondary_background: var(--gray_700);
--vk_connect_button_secondary_foreground: var(--gray_100);
--background_text_highlighted: var(--blue_400_alpha20);
--skeleton_shimmer_from: var(--gray_900);
--skeleton_shimmer_to: var(--transparent_black);
--skeleton_foreground_from: var(--gray_850);
--skeleton_foreground_to: var(--gray_800);
--primary_overlay_badge: var(--white_alpha40);
--secondary_overlay_badge: var(--white_alpha16);
--content_positive_background: var(--green_alpha16);
--content_negative_background: var(--red_alpha16);
--vk_donut_background: var(--gray_850)
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment