diff --git a/README.md b/README.md
index f01540291..8ab0365ce 100644
--- a/README.md
+++ b/README.md
@@ -5,11 +5,6 @@ Alert dashboard for
 
 ---
 
-Release notes can be found on
-[GitHub Release Page](https://github.com/prymitive/karma/releases).
-
----
-
 Alertmanager `0.16.x` is **NOT** supported by karma due to changes
 in the API, see [this issue](https://github.com/prymitive/karma/issues/115)
 for details.
@@ -19,8 +14,13 @@ alertmanager `>=0.17.0` is supported.
 
 ---
 
+## Feature overview
+
 Alertmanager UI is useful for browsing alerts and managing silences, but it's
 lacking as a dashboard tool - karma aims to fill this gap.
+
+### Alert aggregation and deduplication
+
 Starting with the `0.7.0` release it can aggregate alerts from multiple
 Alertmanager instances, running either in HA mode or separate. Unique alerts are
 displayed by filtering duplicates. Each alert is tagged with the names of all
@@ -30,6 +30,8 @@ is configured with multiple Alertmanager instances.
 
 ![Screenshot](/docs/img/screenshot.png)
 
+### Alert visualization
+
 Alerts are displayed grouped preserving
 [group_by](https://prometheus.io/docs/alerting/configuration/#route)
 configuration option in Alertmanager. If a group contains multiple alerts only
@@ -48,27 +50,49 @@ screen space, the silence will also be moved to the footer.
 
 ![Deduplicated silence](/docs/img/footerSilence.png)
 
+### Silence management
+
 Silence modal allows to create new silences and manage all silences already
 present in Alertmanager.
 
 ![Silence browser](/docs/img/silenceBrowser.png)
 
+### Alert overview
+
 Clicking on the alert counter in the top left corner will open the overview
 modal, which allows to quickly get an overview of the top label values for
 all current alerts.
 
 ![Overview](/docs/img/overview.png)
 
+### Alert acknowledgement
+
 Starting with `v0.50` karma can create short lived silences to acknowledge
 alerts with a single button click. To create silences that will resolve itself
 only after all alerts are resolved you can use
 [kthxbye](https://github.com/prymitive/kthxbye).
 See [configuration docs](/docs/CONFIGURATION.md#alert-acknowledgement) for
-details. Example:
+details.
 
-![Acknowledgement demo](/docs/img/ack.gif)
+### Dark mode
 
-[Online demo](https://karma-demo.herokuapp.com/)
+Starting with `v0.51` release karma includes both light and dark themes.
+By default it will follow browser preference using
+[prefers-color-scheme](https://developer.mozilla.org/en-US/docs/Web/CSS/@media/prefers-color-scheme)
+media queries.
+
+![Dark mode](/docs/img/dark.png)
+
+## Demo
+
+[Online demo](https://karma-demo.herokuapp.com/) is running latest master branch
+or PR branch version. It might include features that are experimental and not
+yet ready to be included.
+
+## Release notes
+
+Release notes can be found on
+[GitHub Release Page](https://github.com/prymitive/karma/releases).
 
 To get notifications about new karma releases go to
 [GitHub karma page](https://github.com/prymitive/karma), click `Watch` and
diff --git a/docs/img/ack.gif b/docs/img/ack.gif
deleted file mode 100644
index 84ad500a1..000000000
Binary files a/docs/img/ack.gif and /dev/null differ
diff --git a/docs/img/alertGroup.png b/docs/img/alertGroup.png
index f215de716..ee0799074 100644
Binary files a/docs/img/alertGroup.png and b/docs/img/alertGroup.png differ
diff --git a/docs/img/dark.png b/docs/img/dark.png
new file mode 100644
index 000000000..6de84185e
Binary files /dev/null and b/docs/img/dark.png differ
diff --git a/docs/img/footerSilence.png b/docs/img/footerSilence.png
index 085115676..6df38449e 100644
Binary files a/docs/img/footerSilence.png and b/docs/img/footerSilence.png differ
diff --git a/docs/img/overview.png b/docs/img/overview.png
index e33524ccb..fabc43ca8 100644
Binary files a/docs/img/overview.png and b/docs/img/overview.png differ
diff --git a/docs/img/screenshot.png b/docs/img/screenshot.png
index 338668bc6..fdbb3c540 100644
Binary files a/docs/img/screenshot.png and b/docs/img/screenshot.png differ
diff --git a/docs/img/silenceBrowser.png b/docs/img/silenceBrowser.png
index f3453346b..a33869473 100644
Binary files a/docs/img/silenceBrowser.png and b/docs/img/silenceBrowser.png differ
diff --git a/ui/src/Components/MainModal/Configuration/__snapshots__/ThemeConfiguration.test.js.snap b/ui/src/Components/MainModal/Configuration/__snapshots__/ThemeConfiguration.test.js.snap
index e9fc0d99d..e4ed73342 100644
--- a/ui/src/Components/MainModal/Configuration/__snapshots__/ThemeConfiguration.test.js.snap
+++ b/ui/src/Components/MainModal/Configuration/__snapshots__/ThemeConfiguration.test.js.snap
@@ -7,7 +7,7 @@ exports[`<ThemeConfiguration /> matches snapshot with default values 1`] = `
     <div class=\\"react-select__control css-r5n82u-control\\">
       <div class=\\"react-select__value-container react-select__value-container--has-value css-ct477o\\">
         <div class=\\"react-select__single-value css-1wh03ml-singleValue\\">
-          Automatic theme, follow browser preferences
+          Automatic theme, follow browser preference
         </div>
         <div class=\\"css-b8ldur-Input\\">
           <div class=\\"react-select__input\\"
diff --git a/ui/src/Components/MainModal/Configuration/__snapshots__/index.test.js.snap b/ui/src/Components/MainModal/Configuration/__snapshots__/index.test.js.snap
index 93116a562..eb468e8dd 100644
--- a/ui/src/Components/MainModal/Configuration/__snapshots__/index.test.js.snap
+++ b/ui/src/Components/MainModal/Configuration/__snapshots__/index.test.js.snap
@@ -155,7 +155,7 @@ exports[`<Configuration /> matches snapshot 1`] = `
             <div class=\\"react-select__control css-r5n82u-control\\">
               <div class=\\"react-select__value-container react-select__value-container--has-value css-ct477o\\">
                 <div class=\\"react-select__single-value css-1wh03ml-singleValue\\">
-                  Automatic theme, follow browser preferences
+                  Automatic theme, follow browser preference
                 </div>
                 <div class=\\"css-b8ldur-Input\\">
                   <div class=\\"react-select__input\\"
diff --git a/ui/src/Components/MainModal/__snapshots__/MainModalContent.test.js.snap b/ui/src/Components/MainModal/__snapshots__/MainModalContent.test.js.snap
index bcb5ee98b..fd8b74437 100644
--- a/ui/src/Components/MainModal/__snapshots__/MainModalContent.test.js.snap
+++ b/ui/src/Components/MainModal/__snapshots__/MainModalContent.test.js.snap
@@ -174,7 +174,7 @@ exports[`<MainModalContent /> matches snapshot 1`] = `
                 <div class=\\"react-select__control css-r5n82u-control\\">
                   <div class=\\"react-select__value-container react-select__value-container--has-value css-ct477o\\">
                     <div class=\\"react-select__single-value css-1wh03ml-singleValue\\">
-                      Automatic theme, follow browser preferences
+                      Automatic theme, follow browser preference
                     </div>
                     <div class=\\"css-b8ldur-Input\\">
                       <div class=\\"react-select__input\\"
diff --git a/ui/src/Stores/Settings.js b/ui/src/Stores/Settings.js
index 520bd841e..37e9074b3 100644
--- a/ui/src/Stores/Settings.js
+++ b/ui/src/Stores/Settings.js
@@ -113,7 +113,7 @@ class FilterBarConfig {
 class ThemeConfig {
   options = Object.freeze({
     auto: {
-      label: "Automatic theme, follow browser preferences",
+      label: "Automatic theme, follow browser preference",
       value: "auto"
     },
     light: { label: "Light theme", value: "light" },