diff --git a/src/Bundle/ChillPersonBundle/Resources/public/vuejs/_components/Entity/PersonRenderBox.vue b/src/Bundle/ChillPersonBundle/Resources/public/vuejs/_components/Entity/PersonRenderBox.vue
new file mode 100644
index 000000000..3fead699c
--- /dev/null
+++ b/src/Bundle/ChillPersonBundle/Resources/public/vuejs/_components/Entity/PersonRenderBox.vue
@@ -0,0 +1,102 @@
+<template>
+    <!-- ENTIRE RENDER_BOX -->
+    <div class="item-row entity-bloc">
+
+        <!-- LABEL -->
+        <div class="item-col">
+            <div class="entity-label">
+
+                <!-- NAME TAG -->
+                <div class="denomination **h_level**">
+
+                    <!-- NAME IF ADD LINK AND PERMISSION GRANTED -->
+                    <a href="#">
+                        <span class="firstname">**firstname**</span>
+                        <span class="lastname">**lastname**</span>
+                        <!-- IF ALT NAMES -->
+                        <!-- <span class="altnames"> -->
+                            <!-- LOOP THROUGH ALT NAMES -->
+                            <!-- <span class="altname altname-**key**">**label**</span> -->
+                            <!-- END LOOP -->
+                        <!-- </span> -->
+                    </a>
+
+                    <!-- WITHOUT LINK JUST NAME -->
+                    <span class="firstname">**firstname**</span>
+                    <span class="lastname">**lastname**</span>
+                    <!-- IF ALT NAMES -->
+                    <span class="altnames">
+                        <!-- LOOP THROUGH ALT NAMES -->
+                        <span class="altname altname-**key**">**label**</span>
+                        <!-- END LOOP -->
+                    </span>
+
+                    <!-- IF ADD ENTITY OPTION -->
+                    <span class="badge rounded-pill bg-secondary">**Person object?**</span>
+                    <span class="id-number" title="**n°person_id**">**person_id**</span>
+
+                </div>
+                <!-- END NAME TAG -->
+
+                <!-- BIRTHDATE / DEATHDATE AND AGE -->
+                <p class="moreinfo">
+                    <i class="fa fa-fw **gender**" title="**gender title**"></i>
+                    <time datetime="13/05/1867" title="**birthdate**">
+                        birthdate
+                    </time>
+                    <span class="age">**age**</span>
+                </p>
+                <!-- END BIRTH/DEATH AND AGE -->
+
+            </div>
+        </div>
+        <!-- END LABEL -->
+
+        <!-- EXTRA INFO AND ACTIONS-->
+        <div class="item-col">
+            <ul class="list-content fa-ul">
+                <li>
+                <!-- ADDRESS -->
+                </li>
+
+                <!-- PHONENUMBER -->
+                <li>
+                    <i class="fa fa-li fa-mobile"></i><a href="#">**mobilenumber**</a>
+                    <i class="fa fa-li fa-phone"></i>
+                    <a href="#">**regular phonenumber**</a>
+                    <span class="chill-no-data-statement">**no phonenumber**</span>
+                </li>
+            </ul>
+            <!-- END ADDRESS AND PHONE NUMBER -->
+
+            <!-- ACTION BUTTONS -->
+            <ul class="record_actions">
+                <li>
+                    <a class="btn btn-show" target="_blank" title="Show person"
+                    href="#"></a>
+                </li>
+            </ul>
+            <!-- END ACTIONS -->
+        </div>
+        <!-- END EXTRA INFO AND ACTIONS -->
+
+    </div>
+</template>
+
+<script>
+export default {
+    name: "PersonRenderBox",
+    props: [
+        'options'
+    ],
+    data() {
+        return {
+
+            }
+    },
+    computed: {
+    },  
+}
+</script>
+
+