diff --git a/src/ol/layer/Base.js b/src/ol/layer/Base.js
index 801aad532f..f5e3da3bb0 100644
--- a/src/ol/layer/Base.js
+++ b/src/ol/layer/Base.js
@@ -27,6 +27,7 @@ import {clamp} from '../math.js';
  * visible.
  * @property {number} [maxZoom] The maximum view zoom level (inclusive) at which this layer will
  * be visible.
+ * @property {Object<string, *>} [properties] Arbitrary observable properties. Can be accessed with `#get()` and `#set()`.
  */
 
 /**
@@ -50,6 +51,10 @@ class BaseLayer extends BaseObject {
      * @type {Object<string, *>}
      */
     const properties = assign({}, options);
+    if (typeof options.properties === 'object') {
+      delete properties.properties;
+      assign(properties, options.properties);
+    }
 
     properties[LayerProperty.OPACITY] =
       options.opacity !== undefined ? options.opacity : 1;
diff --git a/src/ol/layer/BaseImage.js b/src/ol/layer/BaseImage.js
index dd6f2e12e7..798c38c111 100644
--- a/src/ol/layer/BaseImage.js
+++ b/src/ol/layer/BaseImage.js
@@ -27,6 +27,7 @@ import Layer from './Layer.js';
  * temporary layers. The standard way to add a layer to a map and have it managed by the map is to
  * use {@link module:ol/Map#addLayer}.
  * @property {import("../source/Image.js").default} [source] Source for this layer.
+ * @property {Object<string, *>} [properties] Arbitrary observable properties. Can be accessed with `#get()` and `#set()`.
  */
 
 /**
diff --git a/src/ol/layer/BaseTile.js b/src/ol/layer/BaseTile.js
index aa833159ff..4d6cede4ac 100644
--- a/src/ol/layer/BaseTile.js
+++ b/src/ol/layer/BaseTile.js
@@ -32,6 +32,7 @@ import {assign} from '../obj.js';
  * temporary layers. The standard way to add a layer to a map and have it managed by the map is to
  * use {@link module:ol/Map#addLayer}.
  * @property {boolean} [useInterimTilesOnError=true] Use interim tiles on error.
+ * @property {Object<string, *>} [properties] Arbitrary observable properties. Can be accessed with `#get()` and `#set()`.
  */
 
 /**
diff --git a/src/ol/layer/BaseVector.js b/src/ol/layer/BaseVector.js
index 606aa6d116..b7da84dbd3 100644
--- a/src/ol/layer/BaseVector.js
+++ b/src/ol/layer/BaseVector.js
@@ -53,6 +53,7 @@ import {
  * batches will be recreated when no animation is active.
  * @property {boolean} [updateWhileInteracting=false] When set to `true`, feature batches will
  * be recreated during interactions. See also `updateWhileAnimating`.
+ * @property {Object<string, *>} [properties] Arbitrary observable properties. Can be accessed with `#get()` and `#set()`.
  */
 
 /**
diff --git a/src/ol/layer/Graticule.js b/src/ol/layer/Graticule.js
index 7d0fbaf0ce..aadbe4ccfa 100644
--- a/src/ol/layer/Graticule.js
+++ b/src/ol/layer/Graticule.js
@@ -164,6 +164,7 @@ const INTERVALS = [
  * [30, 10]
  * ```
  * @property {boolean} [wrapX=true] Whether to repeat the graticule horizontally.
+ * @property {Object<string, *>} [properties] Arbitrary observable properties. Can be accessed with `#get()` and `#set()`.
  */
 
 /**
diff --git a/src/ol/layer/Group.js b/src/ol/layer/Group.js
index f08e7290bb..4e49999945 100644
--- a/src/ol/layer/Group.js
+++ b/src/ol/layer/Group.js
@@ -33,6 +33,7 @@ import {listen, unlistenByKey} from '../events.js';
  * @property {number} [maxZoom] The maximum view zoom level (inclusive) at which this layer will
  * be visible.
  * @property {Array<import("./Base.js").default>|import("../Collection.js").default<import("./Base.js").default>} [layers] Child layers.
+ * @property {Object<string, *>} [properties] Arbitrary observable properties. Can be accessed with `#get()` and `#set()`.
  */
 
 /**
diff --git a/src/ol/layer/Heatmap.js b/src/ol/layer/Heatmap.js
index 7563cdcf04..1db870f645 100644
--- a/src/ol/layer/Heatmap.js
+++ b/src/ol/layer/Heatmap.js
@@ -35,6 +35,7 @@ import {getChangeEventType} from '../Object.js';
  * attribute to use for the weight or a function that returns a weight from a feature. Weight values
  * should range from 0 to 1 (and values outside will be clamped to that range).
  * @property {import("../source/Vector.js").default} [source] Source.
+ * @property {Object<string, *>} [properties] Arbitrary observable properties. Can be accessed with `#get()` and `#set()`.
  */
 
 /**
diff --git a/src/ol/layer/Layer.js b/src/ol/layer/Layer.js
index be4b5245ff..f5b3cd1219 100644
--- a/src/ol/layer/Layer.js
+++ b/src/ol/layer/Layer.js
@@ -40,6 +40,7 @@ import {listen, unlistenByKey} from '../events.js';
  * @property {import("../PluggableMap.js").default} [map] Map.
  * @property {RenderFunction} [render] Render function. Takes the frame state as input and is expected to return an
  * HTML element. Will overwrite the default rendering for the layer.
+ * @property {Object<string, *>} [properties] Arbitrary observable properties. Can be accessed with `#get()` and `#set()`.
  */
 
 /**
diff --git a/src/ol/layer/MapboxVector.js b/src/ol/layer/MapboxVector.js
index da21cede44..3494fd740d 100644
--- a/src/ol/layer/MapboxVector.js
+++ b/src/ol/layer/MapboxVector.js
@@ -212,6 +212,7 @@ const SourceType = {
  * @property {number} [preload=0] Preload. Load low-resolution tiles up to `preload` levels. `0`
  * means no preloading.
  * @property {boolean} [useInterimTilesOnError=true] Use interim tiles on error.
+ * @property {Object<string, *>} [properties] Arbitrary observable properties. Can be accessed with `#get()` and `#set()`.
  */
 
 /**
@@ -276,6 +277,7 @@ class MapboxVectorLayer extends VectorTileLayer {
       updateWhileInteracting: options.updateWhileInteracting,
       preload: options.preload,
       useInterimTilesOnError: options.useInterimTilesOnError,
+      properties: options.properties,
     });
 
     this.sourceId = options.source;
diff --git a/src/ol/layer/VectorImage.js b/src/ol/layer/VectorImage.js
index bb9dbbb745..ecb07c0723 100644
--- a/src/ol/layer/VectorImage.js
+++ b/src/ol/layer/VectorImage.js
@@ -42,6 +42,7 @@ import {assign} from '../obj.js';
  * {@link module:ol/style} for default style which will be used if this is not defined.
  * @property {number} [imageRatio=1] Ratio by which the rendered extent should be larger than the
  * viewport extent. A larger ratio avoids cut images during panning, but will cause a decrease in performance.
+ * @property {Object<string, *>} [properties] Arbitrary observable properties. Can be accessed with `#get()` and `#set()`.
  */
 
 /**
diff --git a/src/ol/layer/VectorTile.js b/src/ol/layer/VectorTile.js
index 6a7841f3fe..538b523a06 100644
--- a/src/ol/layer/VectorTile.js
+++ b/src/ol/layer/VectorTile.js
@@ -63,6 +63,7 @@ import {assign} from '../obj.js';
  * @property {number} [preload=0] Preload. Load low-resolution tiles up to `preload` levels. `0`
  * means no preloading.
  * @property {boolean} [useInterimTilesOnError=true] Use interim tiles on error.
+ * @property {Object<string, *>} [properties] Arbitrary observable properties. Can be accessed with `#get()` and `#set()`.
  */
 
 /**
diff --git a/src/ol/layer/WebGLPoints.js b/src/ol/layer/WebGLPoints.js
index ebe0df2a1c..6681d95ad9 100644
--- a/src/ol/layer/WebGLPoints.js
+++ b/src/ol/layer/WebGLPoints.js
@@ -29,6 +29,7 @@ import {parseLiteralStyle} from '../webgl/ShaderBuilder.js';
  * @property {import("../source/Vector.js").default} [source] Source.
  * @property {boolean} [disableHitDetection=false] Setting this to true will provide a slight performance boost, but will
  * prevent all hit detection on the layer.
+ * @property {Object<string, *>} [properties] Arbitrary observable properties. Can be accessed with `#get()` and `#set()`.
  */
 
 /**
diff --git a/test/browser/spec/ol/layer/layer.test.js b/test/browser/spec/ol/layer/layer.test.js
index af46d03979..10077aef80 100644
--- a/test/browser/spec/ol/layer/layer.test.js
+++ b/test/browser/spec/ol/layer/layer.test.js
@@ -105,6 +105,16 @@ describe('ol.layer.Layer', function () {
       layer.dispose();
     });
 
+    it('assigns key-value pairs of `properties` to the object', function () {
+      const o = new Layer({
+        properties: {
+          foo: 'bar',
+        },
+      });
+      expect(o.get('foo')).to.be('bar');
+      expect(o.get('properties')).to.be(undefined);
+    });
+
     it('throws on non-numeric opacity', function () {
       function create() {
         new Layer({