diff --git a/source/_static/images/import_documentation/widgets-examples/widget-date.png b/source/_static/images/import_documentation/widgets-examples/widget-date.png
new file mode 100644
index 0000000000000000000000000000000000000000..88c90d07d8d12833ae5c7fd20ab4cc6a85ae4f01
Binary files /dev/null and b/source/_static/images/import_documentation/widgets-examples/widget-date.png differ
diff --git a/source/_static/images/import_documentation/widgets-examples/widget-dropdown.png b/source/_static/images/import_documentation/widgets-examples/widget-dropdown.png
new file mode 100644
index 0000000000000000000000000000000000000000..38cac37e89eb946220c6b8935a1a22c449da03b5
Binary files /dev/null and b/source/_static/images/import_documentation/widgets-examples/widget-dropdown.png differ
diff --git a/source/_static/images/import_documentation/widgets-examples/widget-img.png b/source/_static/images/import_documentation/widgets-examples/widget-img.png
new file mode 100644
index 0000000000000000000000000000000000000000..be9a348d07f299b5c80dbf646a8964eb0b23078f
Binary files /dev/null and b/source/_static/images/import_documentation/widgets-examples/widget-img.png differ
diff --git a/source/_static/images/import_documentation/widgets-examples/widget-label.png b/source/_static/images/import_documentation/widgets-examples/widget-label.png
new file mode 100644
index 0000000000000000000000000000000000000000..8666cf179532118a81cdf33e712f13293bd21e6c
Binary files /dev/null and b/source/_static/images/import_documentation/widgets-examples/widget-label.png differ
diff --git a/source/_static/images/import_documentation/widgets-examples/widget-link.png b/source/_static/images/import_documentation/widgets-examples/widget-link.png
new file mode 100644
index 0000000000000000000000000000000000000000..40527124629f235812840a66c350511772942af0
Binary files /dev/null and b/source/_static/images/import_documentation/widgets-examples/widget-link.png differ
diff --git a/source/_static/images/import_documentation/widgets-examples/widget-mailto.png b/source/_static/images/import_documentation/widgets-examples/widget-mailto.png
new file mode 100644
index 0000000000000000000000000000000000000000..f55bc6b4ab736b2fc02da07119c494d48d6df398
Binary files /dev/null and b/source/_static/images/import_documentation/widgets-examples/widget-mailto.png differ
diff --git a/source/_static/images/import_documentation/widgets-examples/widget-placeholder.png b/source/_static/images/import_documentation/widgets-examples/widget-placeholder.png
new file mode 100644
index 0000000000000000000000000000000000000000..e08bb0268313141423731f1d9ce65b33cf11a89e
Binary files /dev/null and b/source/_static/images/import_documentation/widgets-examples/widget-placeholder.png differ
diff --git a/source/_static/images/import_documentation/widgets-examples/widget-radio.png b/source/_static/images/import_documentation/widgets-examples/widget-radio.png
new file mode 100644
index 0000000000000000000000000000000000000000..1a2964aa5c41e26254f5fc11f044584358066915
Binary files /dev/null and b/source/_static/images/import_documentation/widgets-examples/widget-radio.png differ
diff --git a/source/_static/images/import_documentation/widgets-examples/widget-set.png b/source/_static/images/import_documentation/widgets-examples/widget-set.png
new file mode 100644
index 0000000000000000000000000000000000000000..034706135688c7956e7e2708ef1b57c3753cbb31
Binary files /dev/null and b/source/_static/images/import_documentation/widgets-examples/widget-set.png differ
diff --git a/source/_static/images/import_documentation/widgets-examples/widget-textarea.png b/source/_static/images/import_documentation/widgets-examples/widget-textarea.png
new file mode 100644
index 0000000000000000000000000000000000000000..73f26a9005cb4cef79e8ae7b37ffbc5af389dc17
Binary files /dev/null and b/source/_static/images/import_documentation/widgets-examples/widget-textarea.png differ
diff --git a/source/import_documentation/Widgets/Examples.rst b/source/import_documentation/Widgets/Examples.rst
index c8d2d8da2820b877363631e8f9f895ceaf798041..a33ea24b42133c2a80a413960800d0fc34ec73a3 100644
--- a/source/import_documentation/Widgets/Examples.rst
+++ b/source/import_documentation/Widgets/Examples.rst
@@ -1,6 +1,184 @@
 Examples
 =========
 
+Common widgets
+--------------
+
+Here is a few examples of widgets use. First, there is the HTML using Startin'blox and then, the displayed result in a webpage.
+
+All the values from ``<solid-display>`` are displayed with and without widget.
+
+solid-display-img
+~~~~~~~~~~~~~~~~~
+
+.. code:: html
+
+   <solid-display
+      data-src="data/list/user-1.jsonld"
+      fields="notimage, image"
+      value-notimage="https://images.unsplash.com/photo-1621359729423-dcbdbac348fb?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=634&q=80"
+      value-image="https://images.unsplash.com/photo-1621359729423-dcbdbac348fb?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=634&q=80"
+      widget-image="solid-display-img"
+      alt-image="pink flowers"
+   ></solid-display>
+
+.. figure:: ../../_static/images/import_documentation/widgets-examples/widget-img.png
+   :alt: Widget solid-display-img
+
+
+solid-display-link
+~~~~~~~~~~~~~~~~~~
+
+.. code:: html
+
+   <solid-display
+      data-src="data/list/user-1.jsonld"
+      fields="notlink, link"
+      value-notlink="https://startinblox.com/fr/"
+      value-link="https://startinblox.com/fr/"
+      widget-link="solid-display-link"
+    ></solid-display>
+
+.. figure:: ../../_static/images/import_documentation/widgets-examples/widget-link.png
+   :alt: Widget solid-display-link
+
+
+solid-display-link-mailto
+~~~~~~~~~~~~~~~~~~~~~~~~~
+
+.. code:: html
+
+   <solid-display
+      data-src="data/list/user-5.jsonld"
+      fields="email"
+   ></solid-display>
+
+   <solid-display
+      data-src="data/list/user-5.jsonld"
+      fields="email"
+      widget-email="solid-display-link-mailto"
+   ></solid-display>
+
+.. figure:: ../../_static/images/import_documentation/widgets-examples/widget-mailto.png
+   :alt: Widget solid-display-link-mailto
+
+
+solid-display-value-date
+~~~~~~~~~~~~~~~~~~~~~~~~
+
+.. code:: html
+
+   <solid-display
+      data-src="data/list/event-1.jsonld"
+      fields="date"
+   ></solid-display>
+
+   <solid-display
+      data-src="data/list/event-1.jsonld"
+      fields="date"
+      widget-date="solid-display-value-date"
+   ></solid-display>
+
+.. figure:: ../../_static/images/import_documentation/widgets-examples/widget-date.png
+   :alt: Widget solid-display-value-date
+
+
+solid-form-radio
+~~~~~~~~~~~~~~~~
+range attribute
+
+.. code:: html
+
+   <solid-form
+      data-src="data/list/event-1.jsonld"
+      fields="contact"
+      widget-contact="solid-form-radio"
+      range-contact="data/list/users.jsonld"
+   ></solid-form>
+
+.. figure:: ../../_static/images/import_documentation/widgets-examples/widget-radio.png
+   :alt: Widget solid-form-radio
+
+solid-form-dropdown
+~~~~~~~~~~~~~~~~~~~
+enum attribute
+
+.. code:: html
+
+   <solid-form
+      data-src="data/list/event-1.jsonld"
+      fields="personnes"
+      widget-personnes="solid-form-dropdown"
+      enum-personnes="Sacha, Camille, Charlie, Lou"
+   ></solid-form>
+
+.. figure:: ../../_static/images/import_documentation/widgets-examples/widget-dropdown.png
+   :alt: Widget solid-form-dropdown
+
+solid-form-textarea-label
+~~~~~~~~~~~~~~~~~~~~~~~~~
+
+.. code:: html
+
+   <solid-form
+      data-src="data/list/event-1.jsonld"
+      fields="description"
+      widget-description="solid-form-textarea-label"
+   ></solid-form>
+
+.. figure:: ../../_static/images/import_documentation/widgets-examples/widget-textarea.png
+   :alt: Widget solid-form-textarea-label
+
+solid-form-text-placeholder
+~~~~~~~~~~~~~~~~~~~~~~~~~~~
+
+.. code:: html
+
+   <solid-form
+      data-src="./data/list/users.jsonld"
+      fields="first_name"
+      widget-first_name="solid-form-text-placeholder"
+      placeholder-first_name="Enter your name"
+   ></solid-form>
+
+.. figure:: ../../_static/images/import_documentation/widgets-examples/widget-placeholder.png
+   :alt: Widget solid-form-text-placehoder
+
+solid-form-text-label
+~~~~~~~~~~~~~~~~~~~~~
+
+.. code:: html
+
+   <solid-form
+      data-src="./data/list/users.jsonld"
+      fields="first_name"
+      widget-first_name="solid-form-text-label"
+      label-first_name="First name :"
+   ></solid-form>
+
+.. figure:: ../../_static/images/import_documentation/widgets-examples/widget-label.png
+   :alt: Widget solid-form-text-label
+
+solid-set-div
+~~~~~~~~~~~~~
+
+.. code:: html
+
+   <solid-display
+      data-src="data/list/users.jsonld"
+      fields="name(first_name, ' - ' ,last_name, ' - ', username)"
+      widget-name="solid-set-div"
+   ></solid-display>
+
+.. figure:: ../../_static/images/import_documentation/widgets-examples/widget-set.png
+   :alt: Widget solid-set-div
+
+*The border is applied on solid-set-div*
+
+
+Step-by-step widget creation
+----------------------------
+
 Create your widget
 ~~~~~~~~~~~~~~~~~~