List of CSS variables of Hugo search module.
Become a backer or sponsor to support our work.
You can easily to adjust the search UI to fit your theme and dark mode via the following CSS variables.
1:root {
2 --search-primary: skyblue;
3}
Name | Description |
---|---|
--search-primary | Primary color. |
--search-container-bg | Container background color. |
--search-bg | Background color. |
--search-color | Primary text color. |
--search-color-secondary | Secondary text color. |
--search-result-bg | Result background color. |
--search-result-bg-active | Result background color on active. |
--search-result-color | Primary result text color. |
--search-result-color-active | Primary result text color on active. |
--search-result-color-secondary | Secondary result text color. |
--search-result-color-secondary-active | Secondary result text color on active. |
--search-result-highlight-bg | The highlight result background color, default to inherit . |
--search-result-highlight-color | The highlight result color, default to inherit . |
--search-border-color | Border color. |