diff --git a/frontend/src/components/TemplateCard.jsx b/frontend/src/components/TemplateCard.jsx
index 583b6cb..9ed7ea6 100644
--- a/frontend/src/components/TemplateCard.jsx
+++ b/frontend/src/components/TemplateCard.jsx
@@ -9,7 +9,7 @@ export const TemplateCard = ({ template, onClickCallback }) => (
     className="m-2 mt-6 max-w-sm cursor-pointer rounded-lg bg-gray-200 shadow-md hover:bg-custom-light dark:bg-custom-dark-2 dark:shadow-dark dark:hover:bg-custom-dark-4"
   >
     <div className="p-5">
-      <h5 className="mb-2 text-2xl font-bold text-gray-900 dark:text-gray-100">
+      <h5 className="mb-2 text-2xl font-normal text-gray-900 dark:text-gray-100">
         {template.name}
       </h5>
       <p className="mb-3 font-normal text-gray-700 dark:text-gray-300">
diff --git a/templates/common_macros.html.j2 b/templates/common_macros.html.j2
index 99a0b55..258a582 100644
--- a/templates/common_macros.html.j2
+++ b/templates/common_macros.html.j2
@@ -75,3 +75,35 @@
 {%- macro typed_name(object) -%}<b>{{ object.__class__.__name__ }}</b> <a href="{{ object | make_href }}">{{ object.name  | trim }}</a>{%- endmacro -%}
 
 {%- macro linked_name(object) -%}<a href="{{ object | make_href }}">{{ object.name  | trim }}</a>{%- endmacro -%}
+
+{%- macro display_traceability(object, complain=False) -%}
+    {%- set realized_attrs = [] -%}
+    {%- set realizing_attrs = [] -%}
+    {%- for attr in object.__dir__() -%}
+        {%- if attr.startswith("realized_") -%}
+            {% set _none = realized_attrs.append(attr) %}
+        {%- elif attr.startswith("realizing_") -%}
+            {% set _none = realizing_attrs.append(attr) %}
+        {%- endif-%}
+    {%- endfor -%}
+    {%- set realized_objects = object[realized_attrs | first] if realized_attrs else None -%}
+    {%- set realizing_objects = object[realizing_attrs | first] if realizing_attrs else None -%}
+    
+    <h2>Traceability</h2>
+    {% if realized_objects %}
+    <p>{{ object.name }} realizes the following objects:<p>
+    <ul>
+    {%- for obj in realized_objects -%}<li>{{ typed_name(obj) | safe}}</li>{%- endfor -%}
+    </ul>
+    {%- elif complain -%}
+        <p style="color: red;">{{ object.name }} doesn't seem to realize any object</p>
+    {%- endif -%}
+    {% if realizing_objects %}
+    <p>{{ object.name }} is realized by the following objects:</p>
+    <ul>
+    {%- for obj in realizing_objects -%}<li>{{ typed_name(obj) | safe}}</li>{%- endfor -%}
+    </ul>
+    {%- elif complain -%}
+        <p style="color: red;">{{ object.name }} doesn't seem to be realized by any object</p>
+    {% endif %}
+{%- endmacro -%}
\ No newline at end of file
diff --git a/templates/exchange-item.html.j2 b/templates/exchange-item.html.j2
new file mode 100644
index 0000000..a65b0cb
--- /dev/null
+++ b/templates/exchange-item.html.j2
@@ -0,0 +1,27 @@
+{#
+    Copyright DB InfraGO AG and contributors
+    SPDX-License-Identifier: Apache-2.0
+#}
+
+{% from 'common_macros.html.j2' import show_other_attributes, description, typed_name %}
+
+<h1>Exchange Item <b>{{ object.name if object.name else "Unnamed"}}</b></h1>
+{{ description(object) | safe }}
+
+<h2>Usage</h2>
+<p>The exchange item "{{ object.name }}" is produced and used across the model in the following cases:</p>
+<ul>
+{%- for exchange in object.exchanges -%}
+    {%- set src = exchange.source.owner.owner if exchange.source.owner.owner else None -%}
+    {%- set tgt = exchange.target.owner.owner if exchange.target.owner.owner else None -%}
+    <li>
+        {{ typed_name(exchange) | safe }}
+        , produced by {{ typed_name(exchange.source.owner) | safe }} of {{ typed_name(src) | safe if src else "Unassigned" }}
+        &nbsp;and consumed by {{ typed_name(exchange.target.owner) | safe }} of {{ typed_name(tgt) | safe if tgt else "Unassigned" }}</li>
+{%- endfor -%}
+</ul>
+
+<h2>Other attributes</h2>
+
+{%- set excluded = ["name", "xtype", "description", "exchanges"] -%}
+{{show_other_attributes(object, excluded) | safe}}
diff --git a/templates/exchange-item.yaml b/templates/exchange-item.yaml
new file mode 100644
index 0000000..baf759b
--- /dev/null
+++ b/templates/exchange-item.yaml
@@ -0,0 +1,10 @@
+# Copyright DB InfraGO AG and contributors
+# SPDX-License-Identifier: Apache-2.0
+
+template: exchange-item.html.j2
+name: Exchange Item
+description: Specifies an exchange item, i.e. energy / material / information.
+category: xc
+variable:
+  name: object
+  type: ExchangeItem
diff --git a/templates/system-interface.html.j2 b/templates/system-interface.html.j2
index f5857d4..5460a45 100644
--- a/templates/system-interface.html.j2
+++ b/templates/system-interface.html.j2
@@ -3,17 +3,21 @@
     SPDX-License-Identifier: Apache-2.0
 #}
 
-{% from 'common_macros.html.j2' import show_other_attributes, linked_name %}
+{% from 'common_macros.html.j2' import show_other_attributes, linked_name, display_traceability %}
 
 {% macro describe_exchange_direction(source, target, interface, exchanges) %}
     <p>
-        {{ linked_name(source) | safe }} should provide 
-        {% for fex in exchanges %}
-        <a href="{{ fex.source.owner | make_href }}">{{ fex.name }}</a>{% if not loop.last %}, {% else %} and {% endif %}
+        {%- set unique_exchange_names = [] -%}
+        {{ linked_name(source) | safe }} should provide&nbsp; 
+        {%- for fex in exchanges  -%}
+            {%- if fex.name not in unique_exchange_names -%}
+                <a href="{{ fex.source.owner | make_href }}">{{ fex.name }}</a>{% if not loop.last %}, {% else %} {% endif %}
+                {%- set _none = unique_exchange_names.append(fex.name) -%}
+            {%- endif -%}
         {% endfor %}
-        via <i>{{ interface.name }}</i> interface (component exchange) so that {{ linked_name(target) | safe }} could 
+        via <i>{{ interface.name }}</i> interface (component exchange) so that {{ linked_name(target) | safe }} could&nbsp; 
         {%- for fnc in exchanges | map(attribute='target.owner') | unique -%}
-        {{ linked_name(fnc) | safe }}{% if not loop.last %}, {% else %} and {% endif %}
+        {{ linked_name(fnc) | safe }}{% if not loop.last %}, {% else %} {% endif %}
         {%- endfor -%}
     </p>
 {% endmacro %}
@@ -46,5 +50,9 @@
 <p>The functional interactions between interface partners via {{ object.name }} are summarized by the diagram below:</p>
 {{ object.context_diagram.as_svg | safe }}
 
-{% set filtered = ["name", "description", "xtype", "allocated_functional_exchanges", "context_diagram"]%}
+{{ display_traceability(object, complain=False) | safe }}
+
+<h2>Other object attributes</h2>
+
+{% set filtered = ["name", "description", "xtype", "allocated_functional_exchanges", "context_diagram", "parent", "realizing_component_exchanges", "realized_component_exchanges"]%}
 {{show_other_attributes(object, filtered) | safe}}
diff --git a/templates/system_function.html.j2 b/templates/system_function.html.j2
index 2493e0b..b60b099 100644
--- a/templates/system_function.html.j2
+++ b/templates/system_function.html.j2
@@ -2,26 +2,25 @@
     Copyright DB InfraGO AG and contributors
     SPDX-License-Identifier: Apache-2.0
 #}
-{% from 'common_macros.html.j2' import show_other_attributes %}
+{% from 'common_macros.html.j2' import show_other_attributes, linked_name %}
 
 <h1>{{ object.name | capitalize }}</h1>
 
-{% if object.description %}
-<p>{{ object.description }}</p>
+{% if object.owner %}
+    <p>A function of {{ linked_name(object.owner) | safe }}</p>
 {% else %}
-<p style="color:red">No description available.</p>
+    <p style="color: red;">This function is not allocated to any entity / no entity is responsible for it.</p>
 {% endif %}
 
-<h2>Function owner</h2>
-{% if object.owner %}
-    <p>An Entity that is responsible for providing this function: <b><a href="{{ object.owner | make_href }}">{{object.owner.name}}</a></b>.</p>
+{% if object.description %}
+<p>{{ object.description }}</p>
 {% else %}
-    <p>This function is not allocated to any entity / no entity is responsible for it.</p>
+<p style="color:red">No description available.</p>
 {% endif %}
 
 <h2>Conditional availability</h2>
 {% if object.available_in_states %}
-<p>The function is available in the following Entity states:</p>
+<p>The function is available in the following states of the {{ linked_name(object.owner) | safe }}:</p>
 <ul>
     {% for state in object.available_in_states %}
         <li><a href="{{ state | make_href }}">{{ state.name }}</a></li>