Skip to content
On this page

Customizing Kagi CSS

Cascading Style Sheets (CSS) is a language used to stylize HTML elements in web pages. Using CSS, you can fully customize Kagi's search and landing pages from your Appearance settings.

Custom CSS does not apply to Settings pages, and is limited to 10,000 characters.

Use the no_css query parameter (for example, kagi.com/search?q=test&no_css) to disable your custom CSS if something horribly breaks!

User Themes

Our users have built and shared many themes. Check out awesome-kagi-css or themes below.

  • Kagi Oranginum by sefidel

  • Brave Theme by http.james

  • Cozy Theme by James Lyons

  • Dark Mustard by Josh Ellington

  • Familiar Dark by Oleh Vanin

  • Google Style Dark by Neil Lee

  • Gruvbox Material Light and Gruvbox Material Dark by mmmotion

  • Minimal Fav Color by Matt Rangel

  • Monokai Hack by maxpl01t

  • Solarized by Liam Galt

  • Startpage Theme by http.james

  • Nocturnal Theme by Kel

  • Vintage Book style by Hehe

  • Enhanced Dark Theme by El Dude

    User El_Dude shared an Enhanced Dark Theme in the  Kagi Discord server #appearance channel.

    Enhanced Dark Applied

    The following only works when you have applied the Dark Theme in your appearance.

    Dark Theme Settings

    You will also need to make sure the Default Dark Theme is set to "Royal Blue".

    Default_Dark_Theme

    To use this theme apply the following custom CSS in your Appearance settings.

    css
    @import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300;400;500;600;700&display=swap');
    .theme_dark {
      --k-accent: #f16d43;
      --k-accent-alt: #62a09d;
      --k-accent-hover: #dd633d;
      --k-accent-background: rgba(241, 109, 67, 0.2);
      /* CONTEXT COLORS */
      --k-background-primary: #232326;
      --k-surface-primary: #2e2e32;
      --k-surface-secondary: #3e3e44;
      --k-surface-tertiary: #5f5f68;
      --k-border: #3d3d43;
      /* TEXT COLORS */
      --k-foreground-primary: #f4f2f4;
      --k-foreground-secondary: #dcdbdd;
      --k-foreground-tertiary: #a09fa6;
      --k-foreground-quaternary: #6d6c74;
      --k-foreground-quinary: #4d4c52;
      --cheatsh_background: var(--k-surface-primary);
      --cheatsh_ef186: #d7d787;
      --cheatsh_ef15: #fdf6e3;
      --cheatsh_ef148: #afd700;
      --cheatsh_ef81: #5fd7ff;
      --color-scheme: dark;
      --background-color: var(--k-background-primary);
      --background-color_opac: rgba(38, 40, 55, 0);
      --page-text-color: var(--k-foreground-tertiary);
      --beta-tag-bg: #4835bc;
      --beta-tag-text: #f2f0e7;
      --beta-tag-inside-corners: #9debfe;
      --login_page_bg: var(--k-background-primary);
      --login_page_divider_strap: var(--k-border);
      --login_page_input_bg: var(--k-background-primary);
      --color-primary: var(--k-foreground-primary);
      --color-secondary: var(--k-foreground-secondary);
      --color_link: var(--accent);
      --color-primary_hover: var(--accent-hover);
      --color-primary_visited: var(--accent-hover);
      --input-bg: var(--k-background-primary);
      --bangs_tag_bg: var(--color-primary);
      --doggo-color-1: #e5e5e5;
      --doggo-bg-color: var(--k-surface-secondary);
      --landing-page-clouds-opacity: 0.8;
      --quick-search-bg: var(--k-surface-primary);
      --quick-search-icon: #4835bc;
      --tabs-round-bg: var(--k-surface-primary);
      --tabs-round-active-bg: var(--k-surface-secondary);
      --color_cat_buttons: var(--color-primary-dim_7);
      --color_cat_buttons_active: var(--color-secondary);
      --color_cat_buttons_bg: var(--color-primary);
      --color_cat_buttons_border: var(--color-primary-dim_2);
      --color_cat_buttons_border_hover: var(--color-primary-dim_5);
      --header-bg: var(--k-surface-primary);
      --header-border: var(--k-border);
      --app-logo: var(--k-surface-secondary);
      --app-logo-bg: #ffb319;
      --footer-bg: var(--k-surface-primary);
      --control-center-dd-bg: var(--k-surface-primary);
      --control-center-dd-bg_hover: var(--k-surface-secondary);
      --control-center-dd-list: var(--k-surface-primary);
      --control-center-dd-list-bg_hover: var(--k-surface-secondary);
      --control-center-bg: var(--k-background-primary);
      --control-center-dd-border: #43465b;
      --filter-dd-bg: var(--k-background-primary);
      --cc-filters-active-bg: var(--k-border);
      --k-tooltip-bg: var(--k-surface-secondary);
      --k-tooltip-text: var(--k-foreground-tertiary);
      --dd-hover-bg: var(--k-surface-secondary);
      --dd-list-input-bg: var(--k-background-primary);
      --not-found-bubble-bg: var(--k-surface-secondary);
      --app-sidebar-bg: var(--k-surface-primary);
      --app-sidebar-item-border: var(--k-border);
      --app-sidebar-link: var(--k-foreground-secondary);
      --app-sidebar-nav-item-bg_hover: var(--k-surface-secondary);
      --app-sidebar-nav-item-link_hover: var(--k-foreground-primary);
      --app-sidebar-nav-item-icon_hover: var(--k-accent);
      --app-sidebar-lense-link: var(--k-foreground-tertiary);
      --app-sidebar-lense-link_hover: var(--k-foreground-primary);
      --ranked-box-overlay-bg: rgba(18, 18, 18, 0.9);
      --ranked-box-wrapper-bg: var(--k-surface-primary);
      --ranked-box-connection-secure: #60aa55;
      --ranked-box-connection-insecure: #fd6820;
      --ranked-box-icon-normal-bg: var(--ranked-box-wrapper-bg);
      --ranked-box-tracker-no-info: var(--k-foreground-tertiary);
      --ranked-box-toggle-switch-ch1-text: var(--color-primary);
      --ranked-box-toggle-switch-ch3-svg-bg: var(--color-secondary);
      --ranked-box-settings-btn-bg: var(--ranked-box-wrapper-bg);
      --rank-icon-shard-color: #a1a1a1;
      --rank_icon_boosted: #ffb319;
      --btn-group-bg: var(--k-background-primary);
      --result-item-title-border: var(--k-border);
      --result-item-title-border_hover: var(--k-border);
      --result-rank-icon-stroke_promoted: var(--background-color);
      --k-tooltip-tracker_bg: var(--k-surface-secondary);
      --result-item-highlight: #9debfe;
      --search-result-content-text: var(--color-primary-dim_6);
      --search-result-group-item-link: var(--color-primary-dim_9);
      --search-result-url-link: var(--color-primary-dim_9);
      --search-result-title: var(--k-foreground-primary);
      --search-result-date-bg: var(--k-foreground-quaternary);
      --search-result-date-new-bg: var(--k-surface-tertiary);
      --search-result-date-new: var(--k-foreground-tertiary);
      --inline-header-title: var(--k-foreground-primary);
      --inline-widget-bg: var(--k-surface-primary);
      --inline-header-border: var(--k-border);
      --inline-domain-tag-bg: var(--k-surface-secondary);
      --related-item-bg: var(--k-surface-primary);
      --username-button-bg: var(--k-surface-secondary);
      --ranked-tabs-border: var(--k-border);
      --video-item-bg: var(--k-surface-primary);
      --auto-sugg-bg_hover: var(--k-surface-secondary);
      --widget-progress_bar: #e5e5e5;
      --translate-fc_icon: var(--k-foreground-quaternary);
      --rating-star_background: var(--k-surface-secondary);
      --wiki-title: var(--k-foreground-primary);
      --wiki-content-links: var(--k-foreground-primary);
      --toggle-switch-knob-bg: var(--k-surface-secondary);
      --m_sri_gap_color: var(--k-border);
      --image_brightness: 85%;
      --onboarding_theme_options_dark_visibility: flex;
      --onboarding_theme_options_light_visibility: none;
      --onb_theme_light_preview_box: none;
      --maps-highlight: var(--k-surface-primary);
      --search-result-date-bg: var(--k-surface-tertiary);
    }
    body, html {
      color: var(--k-foreground-tertiary);
    }
    .sidebar-filter-nav-form .sidebar-filter-nav > .filter-item .dd-list {
      background-color: hsla(240, 4%, 19%, 0.9);
      backdrop-filter: blur(5px);
      border-radius: 8px;
      border: 1px solid var(--k-border);
    }
    /* TITLEEEEEEE */
    .__sri-title .__sri_title_link {
      position: relative;
    }
    .__sri-title .__sri_title_link:hover {
      color: var(--k-accent);
    }
    .__sri-title .__sri_title_link {
      color: var(--k-foreground-primary);
      border-bottom: 1px solid hsl(255, 0%, 50%, 0);
      font-size: 1.25rem;
      font-family: 'Space Grotesk', sans-serif;
    }
    .__sri-title .__sri_title_link:visited {
      color: var(--k-foreground-quaternary);
      border-bottom: 1px solid var(--k-accent-background);
    }
    /* VISITED LINKIES */
    .__sri_title_link:visited::before {
      content: '';
      aspect-ratio: 1/1;
      width: 10px;
      background: var(--k-accent);
      position: absolute;
      left: -24px;
      border-radius: 50%;
      top: 12px;
    }
    .__sri-time {
      background-color: var(--k-border);
      border-radius: 5px;
      padding: 0 6px;
      display: inline-block;
    }
    .related-items {
      display: grid;
      margin-top: 0;
      padding-right: 0;
      grid-template-columns: 1fr 1fr;
      gap: 0.6em;
    }
    .related-items a {
      background-color: var(--k-surface-primary);
      border-radius: 5px;
      color: var(--color-primary);
      display: flex;
      margin-bottom: 0;
      width: auto;
    }
    .related-items a:hover {
      background-color: var(--k-surface-secondary);
      color: var(--color-secondary);
    }
    .related-items a:nth-child(odd) {
      margin-right: 0;
    }
    .related-items a:nth-child(even) {
      margin-left: 0;
    }
    .btn.--primary:hover {
      color: var(--k-foreground-primary);
      background-color: var(--k-surface-secondary);
    }
    .btn.--primary,
    .ranked-item-tab-links a.--primary {
      color: var(--k-foreground-primary);
      background-color: var(--k-surface-primary);
    }
    .btn.--secondary,
    .ranked-item-tab-links a {
      color: var(--k-foreground-primary);
      border: 1px solid var(--k-border);
    }
    .btn.--secondary:hover,
    .ranked-item-tab-links a:hover {
      border: 1px solid var(--k-border);
      color: var(--k-foreground-primary);
      background-color: var(--k-surface-primary);
    }
    ._0_app_theme_switch_box button.checked ._0_active_theme_name,
    ._0_app_theme_switch_box button > input:checked + ._0_active_theme_name {
      background-color: var(--k-surface-primary);
      color: var(--k-foreground-primary);
    }
    ._0_app_theme_switch_box button {
      border: 1px solid var(--k-border);
    }
    .k_ui_toggle_switch {
      --bg-color: transparent;
      --active-bg-color: var(--k-accent);
      --border-color: var(--k-border);
      --active-border-color: var(--k-border);
    }
    .quick-settings .quick-settings-separator {
      border-top: 1px solid var(--k-border);
    }
    ._0_d_info_ranking.k_ui_btn_group input:checked + .box.k_ui_btn,
    ._0_sri-w-highlight .box.searchResultAnswer,
    .box.--active,
    .box._0_sri-w-highlight,
    .box:hover {
      outline: 3px solid var(--k-accent);
    }
    .__sri-url .path {
      color: var(--k-foreground-quaternary);
    }
    /* SUB RESULT CARD */
    .sri-group .__dl {
      padding-bottom: 5px;
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 1rem;
    }
    .sri-group .__dl .__srgi {
      margin-top: unset;
      width: auto;
      margin-bottom: 0;
      padding-right: 0.7em;
    }
    .__srgi {
      display: block;
      padding: 0.7em;
      background: var(--k-surface-primary);
      border-radius: 10px;
      border: 1px solid var(--k-border);
      width: auto;
      min-width: -webkit-fill-available;
    }
    .sri-group .sr-group:has(.__srgi) {
      margin-top: 20px;
      margin-bottom: 40px;
      border-left: 1px solid var(--k-border);
    }
    .land_tooltip_message {
      border: 1px solid var(--k-border);
      background-color: var(--k-surface-secondary);
    }
    .k_ui_btn_group {
      background-color: var(--btn-group-bg);
      border: 1px solid var(--color-primary-dim_3);
      border-radius: 8px;
      display: flex;
      font-size: 0.875rem;
    }
    ._0_d_info_ranking.k_ui_btn_group input:checked + .k_ui_btn,
    ._0_sri-w-highlight .k_ui_btn_group .k_ui_btn.searchResultAnswer,
    .k_ui_btn_group ._0_sri-w-highlight .k_ui_btn.searchResultAnswer,
    .k_ui_btn_group .k_ui_btn.--active,
    .k_ui_btn_group .k_ui_btn._0_sri-w-highlight.box,
    .k_ui_btn_group .k_ui_btn:hover {
      background-color: var(--color-primary-dim_3);
      color: var(--color-primary);
    }
    .k_ui_dropdown_data_list {
      padding: 0.6em 0;
      background-color: var(--k-surface-primary);
      border-radius: 10px;
      border: 1px solid var(--k-border);
      min-width: 160px;
    }
    .k_ui_dropdown_data_list .list_items > ._0_k_ui_dropdown_li,
    .k_ui_dropdown_data_list .list_items > a {
      color: var(--k-foreground-primary);
      padding: 0.4em 2em 0.4em 0.8em;
      border-radius: 0 !important;
    }
    .k_ui_dropdown_data_list .list_items>._0_k_ui_dropdown_li .icon_check, .k_ui_dropdown_data_list .list_items>a .icon_check {
      left: auto;
      right: 10px;
    }
    ._0_lenses .k_ui_dropdown hr {
      border-top: 1px solid var(--k-border);
    }
    .widget_codeblock {
      border: 1px solid var(--k-border);
      background-color: var(--k-surface-primary);
    }
    .widget_codeblock .lines a:hover {
      background: var(--k-surface-secondary);
      color: inherit;
      border-radius: 5px;
    }
    ._0_page-seperator {
      position: relative;
      margin-bottom: 50px;
      margin-top: 10px;
      border-bottom: 1px solid var(--k-border);
    }
    .searchResultAnswers {
      padding-top: 12px;
      margin-bottom: 1em;
    }
    .searchResultAnswers .widgetItems .searchResultAnswer {
      transition: background-color 150ms ease-in-out;
      border-radius: 5px;
      background-color: var(--k-surface-primary);
      border: 1px solid var(--k-border);
    }
    .searchResultAnswers .widgetItems .searchResultAnswer:hover {
      transition: background-color 150ms ease-in-out;
      background-color: var(--k-background-primary);
      border: 1px solid var(--k-border);
    }
    .searchResultAnswers .widgetItems .searchResultAnswer:hover .searchResultAnswerDate {
      color: var(--k-foreground-secondary);
    }
    .searchResultAnswers .widgetItems .searchResultAnswer:hover .searchResultAnswerUpvotes {
      color: var(--k-foreground-secondary);
    }
    .searchResultAnswers .widgetItems .searchResultAnswer:hover .searchResultAnswerUpvotes i {
      color: var(--k-accent);
    }
    .ranked-box-wrapper {
      background-color: var(--k-surface-primary);
      border-radius: 5px;
      box-shadow: 0 0 20px var(--ranked-box-shadow);
    }
    .d-info-body {
      flex-wrap: wrap;
      background-color: var(--k-surface-secondary);
      border-radius: 5px;
    }
    .widgetContent .widgetItems .widgetItem {
        border: 1px solid var(--k-border);
    }
    .widgetContent .widgetItems .widgetItem:hover {
      background-color: var(--k-background-primary)
    }
    .wikipediaRelatedSection .wikipediaRelatedItems {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 0.5rem;
      height: auto;
      align-content: stretch;
    }
    .wikipediaRelatedSection .wikipediaRelatedItems .wikipediaRelatedArticle {
      margin-bottom: 0;
    }
    .wikipediaRelatedSection .wikipediaRelatedItems .wikipediaRelatedArticle div:first-child {
      width: 100%;
      height: 100%;
    }
    .wikipediaRelatedSection .wikipediaRelatedItems .wikipediaRelatedArticle a {
      display: flex;
      flex-direction: column;
      border-bottom: unset;
      text-align: left;
      gap: 0.5em;
      padding: 0.6em;
      border-radius: 10px;
      background-color: var(--k-surface-primary);
      height: 100%;
      border: 1px solid var(--k-border);
    }
    .wikipediaRelatedSection .wikipediaRelatedItems .wikipediaRelatedArticle img {
      width: 100%;
      border-radius: 5px;
      object-fit: cover;
      aspect-ratio: 3/4;
      height: 100%;
      max-width: 100%;
      max-height: 100%;
      height: 100%;
    }
    .wikipediaRelatedSection .wikipediaRelatedItems .wikipediaRelatedArticle h4 {
      font-size: .875rem;
      margin: 0;
      font-weight: 400;
      line-height: 1.375rem;
      display: -webkit-box;
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 2;
      overflow: hidden;
    }
    .freeScroller {
      padding: 4px 4px 12px 4px;
    }
    .widgetContent .widgetItems .widgetNews .widgetItemBody {
      margin-top: 0.6em;
    }
    .widgetContent .widgetItems .widgetItem .widgetItemBody {
      padding: 0 0.6em;
      margin-bottom: 0.6em;
    }
    .widgetContent .widgetItems .widgetItem {
      border-radius: 10px;
    }
    .widget-header {
      padding: 0 10px;
      border-radius: 0;
      order: 3;
      border-top: 1px solid var(--k-border);
    }
    .auto_suggestions {
      background-color: var(--k-surface-primary);
      border: 1px solid var(--k-border);
      top: 97%;
    }
    .auto_suggestions .auto_item {
      margin-left: 0;
      ma: 0;
      margin-right: 0;
      border-radius: 7px;
      padding: 5px;
    }
    .search-form .search-input-container {
      border: 1px solid var(--k-border);
      border-radius: 24px;
      background-color: var(--k-background-primary);
      position: relative;
      z-index: 60;
    }
    .search-form .search-input {
      border-radius: 0;
      background-color: transparent;
      border-radius: 24px 0 0 24px;
    }
    .search-form .search-form-icons {
      border-radius: 0 24px 24px 0;
      background-color: transparent;
      padding-right: 9px;
    }
    .auto_suggestions {
      position: absolute;
      background-color: var(--k-surface-primary);
      border: 1px solid var(--k-border);
      transform-origin: top;
      transition: transform 150ms ease-in-out;
      transform: scaleY(0);
    }
    .auto_suggestions .auto_suggestions_lenses {
      padding: 10px 15px 10px 55px;
      border-top: 1px solid var(--k-border);
      margin-top: 0;
    }
    .search-form .search-input-container:has(+ .auto_suggestions.--visible) {
      border-radius: 24px 24px 0 0;
    }
    .search-form:has(.search-input-container):has(.autosugg-landing > .auto_suggestions.--visible) .search-input-container {
      border-radius: 24px 24px 0 0;
    }
    .cheatsh.hnd .h-template-title {
      color: var(--k-foreground-primary);
    }
    .cheatsh.hnd .h-template-table {
      border: 1px solid var(--k-border);
      border-radius: 10px;
      margin-top: 5px;
      margin-bottom: 1.5em;
    }
    .cheatsh .cheatsh_content {
      max-height: 710px;
    }
    .cheatsh .cheatsh_show_more_box {
      z-index: 4;
    }
    .cheatsh .cheatsh_show_more_box span {
      z-index: 6;
      padding: 0.6em;
      background: var(--k-surface-primary);
      border-radius: 5px;
      transition: background-color .15s ease-out;
    }
    .cheatsh .cheatsh_show_more_box span:hover {
      background-color: var(--k-surface-secondary);
    }
    .__sri-time.--new {
      color: var(--k-accent);
      background-color: var(--k-accent-background);
    }
    .wikipediaRelatedSection .wikipediaRelatedItems .wikipediaRelatedArticle h4 {
      width: auto;
    }
    .wikipediaRelatedSection .wikipediaRelatedItems .wikipediaRelatedArticle div:first-child {
      width: auto;
      height: auto;
      display: block;
    }
    .wikipediaTable {
      border-top: 1px solid var(--k-border);
    }
    .box {
      border-radius: 10px;
    }
    .box:hover {
      outline: 2px solid var(--k-accent);
    }
    ._0_img-results .images-wrapper {
      gap: 0.6em;
    }
    ._0_img-results .item img {
      height: 120px;
      border-radius: 10px;
      border: none;
      background: var(--k-background-primary);
    }
    ._0_more_search_user_bang_item ._0_more_search_user_bang_item_grabber {
      color: var(--k-foreground-quaternary);
    }
    ._0_more_search_bangs_list_add_box:hover {
      background-color: var(--k-surface-secondary);
    }
    ._0_more_search_user_bang_item._0__active, ._0_more_search_user_bang_item:hover {
        background-color: var(--k-surface-secondary);
    }
    ._0_more_search_bangs_list_add_box {
      border-bottom: 1px solid var(--k-border);
    }
    ._0_more_search_box_title {
      border-bottom: 1px solid var(--k-border);
    }
    ._0_more_search_box_customize_button {
      border-bottom: 1px solid var(--k-border);
    }
    ._0_more_search_box_share_button:hover {
      background-color: var(--k-surface-secondary);
    }
    ._0_more_search_box {
      background-color: var(--k-surface-primary);
      border: 1px solid var(--k-border);
      border-radius: 10px;
    }
    ._0_more_search_box_customize_button:hover {
      background-color: var(--k-surface-secondary);
    }
    .dropdown .dd-list .list_filter_wrpr {
      padding: 0.6em;
    }
    .dropdown .dd-list ._0_list_items {
      max-height: 360px;
    }
    .k_ui_dropdown_data_list .list_items {
      margin-bottom: 0;
    }
    .k_ui_toggle_switch.--mini .k_ui_toggle_switch_bar {
      --border-color: var(--k-background-primary);
    }
    .btn.--yellow, .ranked-item-tab-links a.--yellow {
      color: var(--k-background-primary);
      border: 1px solid var(--k-accent);
      background-color: var(--k-accent);
    }
    .k_ui_toggle_switch.--mini .k_ui_toggle_switch_bar {
      --border-color: var(--k-border);
    }
    .k_ui_toggle_switch.--enabled .k_ui_toggle_switch_bar {
      background-color: var(--k-accent);
    }
    .k_ui_toggle_switch.--mini .k_ui_toggle_switch_bar {
      --border-color: var(--k-border);
      --bg-color: var(--k-background-primary);
    }
    .search-form .search-submit-wrapper {
      margin-top: 1em;
    }
    .search-form .search-input {
      color: var(--k-foreground-primary);
    }
    .search-form .doggo-sit {
      bottom: -1px;
      opacity: 1;
    }
    .search-form .auto_suggestions {
      border-radius: 0 0 24px 24px;
      border: 1px solid var(--k-border);
      padding-top: 0
    }
    .k_ui_dropdown.__transparent .k_ui_dropdown_data_list {
      background-color: var(--k-surface-primary);
    }
    .k_ui_dropdown_data_sort_list_wrpr {
      padding: .6em;
    }
    .k_ui_dropdown_data_list .list_items .line_sep {
      border-bottom: 1px dashed var(--k-border);
      margin: 0 0.6em 0.6em 0.6em;
    }
    .landing_cat_buttons {
      background-color: var(--k-background-primary);
    }
    #adv_search_btn:checked~.landing-category-select {
      display: flex;
      flex-direction: column;
      align-items: center;
    }
    .auto_suggestions .auto_suggestions_in {
      border-top: 1px solid var(--k-border);
      padding-top: 12px;
      margin-bottom: 0;
      padding: 0.4em;
    }
    .land_adv_search_btn {
      display: none;
    }
  • Slimmed Down Theme by rasti

    User rasti shared a Slimmed Down Theme in the Kagi Discord server #appearance channel. This theme removes some of the visual components that are present in Kagi Search, compare

    Slimmed Down Not Applied

    with the following slimmed down page:

    Slimmed Down  Applied

    As another example consider

    Slimmed Down Not Applied

    as compared with the following slimmed down page:

    Slimmed Down  Applied

    To use this theme apply the following custom CSS in your Appearance settings.

    css
    ._0_lenses .k_ui_dropdown {
      display: none;
    }
    ._0_lenses {
      display: none;
    }
    .serp_nav_end .k_ui_dropdown, .serp_nav_end .k_ui_dropdown_data_list {
      display: none;
    }
    .sri_more_menu_box .sri_more_menu {
      display: none;
    }
    .sidebar-filter-nav-form .sidebar-filter-nav {
      display: none;
    }
    ._0_queryInfo {
      display: none;
    }
    .top-panel {
    display: none;
    }
    ._0_item.n_ma{
    display: none;
    }
    .serp-nav{
    margin-left: 4px;
    }
    .search-result, .sri-group {
        margin-left: -17px;
        margin-right: -17px;
        padding: 15px;
        margin-bottom: 0px;
    border-bottom: 0px;
    }
    ._0_item.n_ne {
    display: none;
    }
    .m-h {
        padding: 0 10px;
        border-bottom: 0px solid var(--color-primary-dim_2);
    }
    
    .m-h .search-form-icons {
        display: none;
    }
    .theme_moon_dark {
    --search-result-title: #a0c5ff;
    --result-item-title-border: #141414;
    --background-color: #141414;
    --site_info_bottom_bg: #141414;
    }
    .theme_dark {
    --search-result-title: #a0c5ff;
    --result-item-title-border: #141414;
    --background-color: #141414;
    --site_info_bottom_bg: #141414;
    }
    .theme_calm_blue {
    --background-color: #f2f2f6
    }
    .sri-url .sri_url_path_box {
    }
    .sri-url .path {
        display: none;
    }
    .domain-favicon {
      display: none;
    }
    .m-h .m-h-i {
        height: 65px;
    }
    .crisp-edges {
        image-rendering: optimizespeed;
        image-rendering: crisp_edges;
    }
    .sri-desc {
        font-size: .88rem;
        line-height: 1.4;
    }
    
    .rewrite_icon {
        margin-left: 0px;
    }
    .m-image-domain {
        display: none;
    }
    .m-image-res {
        display: none;
    }
    .btn.--secondary-s, .ranked-item-tab-links a.--secondary-s {
        display: none;
    }
    .m-image-preview-buttons a i {
        display: none;
    }
    .m-image-preview-data-box span:first-child {
        display: none;
    }
    ._0_img-results .item img.fade {
        opacity: 0;
        transition: none;
    }
    .quick-search-btn {
        transition: transform .4s ease-in-out;
    }
    .d-info-box-title-header {
        height: 164px;
    }
    .videoResultItem .videoResultRight .videoResultDesc {
        display: none;
    }
    .instant-answer .ia-body .ia-title>div {
        display: none;
    }
    .inline-content+.search-result, .inline-content+.sri-group {
        border-top: 0px solid #a0c5ff
    }
    .instant-answer {
        padding-bottom: 13px;
        padding-top: 13px;
        border-top: 1px solid #a0c5ff;
        border-bottom: 1px solid #a0c5ff;
    }

You can collaborate on themes in the #appearance channel on the Kagi Discord server or the community-managed subreddit.

Customizations

Apply the following custom CSS in your Appearance settings.

Remove Underlined Links

Remove the underline from links from Kagi search results page.

css
/* Remove bottom border from links */
.__sri_title_link._0_sri_title_link._0_URL {
  border-bottom: none;
}

/* Remove underline with nested links */
.__srgi-title a {
border-bottom: none; var(--result-item-title-border);
}

/* Remove underline with News module */
.newsResultItem .newsResultHeader .newsResultTitle a._0_TITLE {
  border-bottom: none; var(--result-item-title-border);
}

/* Remove underline from links in Wikipedia module */
.wikipediaResult a {
  border-bottom: none; var(--result-item-title-border);
}
Hide Quick Search button

Hide the floating Quick Search button from Kagi search results page.

css
.quick-search-btn {
  display: none;
}

Learn

If you want to learn more about how to customize your Kagi Search CSS, below is a video tutorial. The video features a slightly older design of Kagi Search, but the CSS principles are the same.

Also, here are some web resources about how to use CSS in general: