diff --git a/fractal/components/02-display/avatar/01-avatar--size.edge b/fractal/components/02-display/avatar/01-avatar--size.edge
index d825b1e..d1204b9 100644
--- a/fractal/components/02-display/avatar/01-avatar--size.edge
+++ b/fractal/components/02-display/avatar/01-avatar--size.edge
@@ -1,6 +1,6 @@
 <div>
-  @!jrmc.avatar({ url: 'https://placeimg.com/192/192/people', class: 'w-32 rounded' })
-  @!jrmc.avatar({ url: 'https://placeimg.com/192/192/people', class: 'w-20 rounded' })
-  @!jrmc.avatar({ url: 'https://placeimg.com/192/192/people', class: 'w-16 rounded' })
-  @!jrmc.avatar({ url: 'https://placeimg.com/192/192/people', class: 'w-8 rounded' })
+  @!jrmc.avatar({ url: 'https://picsum.photos/id/64/192/192', class: 'w-32 rounded' })
+  @!jrmc.avatar({ url: 'https://picsum.photos/id/64/192/192', class: 'w-20 rounded' })
+  @!jrmc.avatar({ url: 'https://picsum.photos/id/64/192/192', class: 'w-16 rounded' })
+  @!jrmc.avatar({ url: 'https://picsum.photos/id/64/192/192', class: 'w-8 rounded' })
 </div>
diff --git a/fractal/components/02-display/avatar/02-avatar--rounded.edge b/fractal/components/02-display/avatar/02-avatar--rounded.edge
index f6ffcfd..65e83fe 100644
--- a/fractal/components/02-display/avatar/02-avatar--rounded.edge
+++ b/fractal/components/02-display/avatar/02-avatar--rounded.edge
@@ -1,2 +1,2 @@
-@!jrmc.avatar({ url: 'https://placeimg.com/192/192/people', class: 'w-24 rounded-xl' })
-@!jrmc.avatar({ url: 'https://placeimg.com/192/192/people', class: 'w-24 rounded-full' })
+@!jrmc.avatar({ url: 'https://picsum.photos/id/64/192/192', class: 'w-24 rounded-xl' })
+@!jrmc.avatar({ url: 'https://picsum.photos/id/64/192/192', class: 'w-24 rounded-full' })
diff --git a/fractal/components/02-display/avatar/03-avatar--mask.edge b/fractal/components/02-display/avatar/03-avatar--mask.edge
index 011f1f3..2b639f0 100644
--- a/fractal/components/02-display/avatar/03-avatar--mask.edge
+++ b/fractal/components/02-display/avatar/03-avatar--mask.edge
@@ -1,4 +1,4 @@
-@!jrmc.avatar({ url: 'https://placeimg.com/192/192/people', class: 'w-24 mask mask-squircle' })
-@!jrmc.avatar({ url: 'https://placeimg.com/192/192/people', class: 'w-24 mask mask-hexagon' })
-@!jrmc.avatar({ url: 'https://placeimg.com/192/192/people', class: 'w-24 mask mask-triangle' })
+@!jrmc.avatar({ url: 'https://picsum.photos/id/64/192/192', class: 'w-24 mask mask-squircle' })
+@!jrmc.avatar({ url: 'https://picsum.photos/id/64/192/192', class: 'w-24 mask mask-hexagon' })
+@!jrmc.avatar({ url: 'https://picsum.photos/id/64/192/192', class: 'w-24 mask mask-triangle' })
 
diff --git a/fractal/components/02-display/avatar/04-avatar--group.edge b/fractal/components/02-display/avatar/04-avatar--group.edge
index a746a24..163d147 100644
--- a/fractal/components/02-display/avatar/04-avatar--group.edge
+++ b/fractal/components/02-display/avatar/04-avatar--group.edge
@@ -1,5 +1,5 @@
 @jrmc.avatar.group()
-  @!jrmc.avatar({ url: 'https://placeimg.com/192/192/people', class: 'w-12' })
-  @!jrmc.avatar({ url: 'https://placeimg.com/192/192/people', class: 'w-12' })
-  @!jrmc.avatar({ url: 'https://placeimg.com/192/192/people', class: 'w-12' })
+  @!jrmc.avatar({ url: 'https://picsum.photos/id/64/192/192', class: 'w-12' })
+  @!jrmc.avatar({ url: 'https://picsum.photos/id/65/192/192', class: 'w-12' })
+  @!jrmc.avatar({ url: 'https://picsum.photos/id/338/192/192', class: 'w-12' })
 @end
diff --git a/fractal/components/02-display/avatar/05-avatar--group2.edge b/fractal/components/02-display/avatar/05-avatar--group2.edge
index b200d04..af0ac8d 100644
--- a/fractal/components/02-display/avatar/05-avatar--group2.edge
+++ b/fractal/components/02-display/avatar/05-avatar--group2.edge
@@ -1,5 +1,5 @@
 @jrmc.avatar.group({ class: '-space-x-12' })
-  @!jrmc.avatar({ url: 'https://placeimg.com/192/192/people' })
-  @!jrmc.avatar({ url: 'https://placeimg.com/192/192/people' })
+  @!jrmc.avatar({ url: 'https://picsum.photos/id/64/192/192' })
+  @!jrmc.avatar({ url: 'https://picsum.photos/id/65/192/192' })
   @!jrmc.avatar({ placeholder: '+99' })
 @end
diff --git a/fractal/components/02-display/avatar/06-avatar--ring.edge b/fractal/components/02-display/avatar/06-avatar--ring.edge
index f2d1d1c..a436b18 100644
--- a/fractal/components/02-display/avatar/06-avatar--ring.edge
+++ b/fractal/components/02-display/avatar/06-avatar--ring.edge
@@ -1 +1 @@
-@!jrmc.avatar({ url: 'https://placeimg.com/192/192/people', class: 'w-24 rounded-full ring ring-primary ring-offset-base-100 ring-offset-2' })
+@!jrmc.avatar({ url: 'https://picsum.photos/id/64/192/192', class: 'w-24 rounded-full ring ring-primary ring-offset-base-100 ring-offset-2' })
diff --git a/fractal/components/02-display/avatar/07-avatar--status.edge b/fractal/components/02-display/avatar/07-avatar--status.edge
index a90bece..15b597f 100644
--- a/fractal/components/02-display/avatar/07-avatar--status.edge
+++ b/fractal/components/02-display/avatar/07-avatar--status.edge
@@ -1,2 +1,2 @@
-@!jrmc.avatar({ url: 'https://placeimg.com/192/192/people', status: 'online', class: 'w-24 rounded-full' })
-@!jrmc.avatar({ url: 'https://placeimg.com/192/192/people', status: 'offline', class: 'w-24 rounded-full' })
+@!jrmc.avatar({ url: 'https://picsum.photos/id/64/192/192', status: 'online', class: 'w-24 rounded-full' })
+@!jrmc.avatar({ url: 'https://picsum.photos/id/64/192/192', status: 'offline', class: 'w-24 rounded-full' })
diff --git a/fractal/components/02-display/avatar/avatar.edge b/fractal/components/02-display/avatar/avatar.edge
index 39abedc..5b4807b 100644
--- a/fractal/components/02-display/avatar/avatar.edge
+++ b/fractal/components/02-display/avatar/avatar.edge
@@ -1,7 +1,7 @@
 <div>
-  @!jrmc.avatar({ url: 'https://placeimg.com/192/192/people' })
+  @!jrmc.avatar({ url: 'https://picsum.photos/id/64/192/192' })
 
   @jrmc.avatar()
-    <img src="https://placeimg.com/192/192/people" alt="Text alt" />
+    <img src="https://picsum.photos/id/64/192/192" alt="Text alt" />
   @end
 </div>
diff --git a/fractal/components/02-display/card/01-card.edge b/fractal/components/02-display/card/01-card.edge
index e6db65f..0f2e373 100644
--- a/fractal/components/02-display/card/01-card.edge
+++ b/fractal/components/02-display/card/01-card.edge
@@ -1,6 +1,6 @@
 @jrmc.card()
   @slot('top')
-    <figure><img src="https://placeimg.com/400/225/arch" alt="Shoes" /></figure>
+    <figure><img src="https://picsum.photos/400/225" alt="Shoes" /></figure>
   @end
   @jrmc.card.body()
     @!jrmc.card.title({ text: 'Shoes!' })
diff --git a/fractal/components/02-display/card/02-card--compact.edge b/fractal/components/02-display/card/02-card--compact.edge
index a771668..1663f9a 100644
--- a/fractal/components/02-display/card/02-card--compact.edge
+++ b/fractal/components/02-display/card/02-card--compact.edge
@@ -1,6 +1,6 @@
 @jrmc.card({ class: 'card-compact w-96 bg-base-100 shadow-xl' })
   @slot('top')
-    <figure><img src="https://placeimg.com/400/225/arch" alt="Shoes" /></figure>
+    <figure><img src="https://picsum.photos/400/225" alt="Shoes" /></figure>
   @end
   @jrmc.card.body()
     @!jrmc.card.title({ text: 'Shoes!' })
diff --git a/fractal/components/02-display/card/03-card--badge.edge b/fractal/components/02-display/card/03-card--badge.edge
index 1019a8f..e8aef17 100644
--- a/fractal/components/02-display/card/03-card--badge.edge
+++ b/fractal/components/02-display/card/03-card--badge.edge
@@ -1,6 +1,6 @@
 @jrmc.card()
   @slot('top')
-    <figure><img src="https://placeimg.com/400/225/arch" alt="Shoes" /></figure>
+    <figure><img src="https://picsum.photos/400/225" alt="Shoes" /></figure>
   @end
   @jrmc.card.body()
     @jrmc.card.title()
diff --git a/fractal/components/02-display/card/04-card--bottom-image.edge b/fractal/components/02-display/card/04-card--bottom-image.edge
index 8860bcc..9aa9553 100644
--- a/fractal/components/02-display/card/04-card--bottom-image.edge
+++ b/fractal/components/02-display/card/04-card--bottom-image.edge
@@ -8,6 +8,6 @@
     @end
   @end
   @slot('bottom')
-    <figure><img src="https://placeimg.com/400/225/arch" alt="Shoes" /></figure>
+    <figure><img src="https://picsum.photos/400/225" alt="Shoes" /></figure>
   @end
 @end
diff --git a/fractal/components/02-display/card/05-card--center-content.edge b/fractal/components/02-display/card/05-card--center-content.edge
index c2bce4e..8ffa124 100644
--- a/fractal/components/02-display/card/05-card--center-content.edge
+++ b/fractal/components/02-display/card/05-card--center-content.edge
@@ -1,6 +1,6 @@
 @jrmc.card()
   @slot('top')
-    <figure class="px-10 pt-10"><img src="https://placeimg.com/400/225/arch" alt="Shoes" /></figure>
+    <figure class="px-10 pt-10"><img src="https://picsum.photos/400/225" alt="Shoes" /></figure>
   @end
   @jrmc.card.body({ class: 'items-center text-center' })
     @!jrmc.card.title({ text: 'Shoes!' })
diff --git a/fractal/components/02-display/card/06-card--image-overlay.edge b/fractal/components/02-display/card/06-card--image-overlay.edge
index e42c7ce..6fbdd28 100644
--- a/fractal/components/02-display/card/06-card--image-overlay.edge
+++ b/fractal/components/02-display/card/06-card--image-overlay.edge
@@ -1,6 +1,6 @@
 @jrmc.card({ class: 'w-96 bg-base-100 shadow-xl image-full'})
   @slot('top')
-    <figure><img src="https://placeimg.com/400/225/arch" alt="Shoes" /></figure>
+    <figure><img src="https://picsum.photos/400/225" alt="Shoes" /></figure>
   @end
   @jrmc.card.body()
     @!jrmc.card.title({ text: 'Shoes!' })
diff --git a/fractal/components/02-display/card/10-card--with-image-on-side.edge b/fractal/components/02-display/card/10-card--with-image-on-side.edge
index a850cf7..95c264f 100644
--- a/fractal/components/02-display/card/10-card--with-image-on-side.edge
+++ b/fractal/components/02-display/card/10-card--with-image-on-side.edge
@@ -1,6 +1,6 @@
 @jrmc.card({ class: 'card-side bg-base-100 shadow-xl' })
   @slot('top')
-    <figure><img src="https://placeimg.com/200/280/arch" alt="Movie"></figure>
+    <figure><img src="https://picsum.photos/200/280" alt="Movie"></figure>
   @end
   @jrmc.card.body()
     @!jrmc.card.title({ text: 'New movie is released!' })
diff --git a/fractal/components/02-display/card/11-card--with-image-on-side-vertical-on-small-screen-and-horizontal-on-large-screen.edge.edge b/fractal/components/02-display/card/11-card--with-image-on-side-vertical-on-small-screen-and-horizontal-on-large-screen.edge.edge
index 6776de3..1bbc33d 100644
--- a/fractal/components/02-display/card/11-card--with-image-on-side-vertical-on-small-screen-and-horizontal-on-large-screen.edge.edge
+++ b/fractal/components/02-display/card/11-card--with-image-on-side-vertical-on-small-screen-and-horizontal-on-large-screen.edge.edge
@@ -1,6 +1,6 @@
 @jrmc.card({ class: 'lg:card-side bg-base-100 shadow-xl' })
   @slot('top')
-    <figure><img src="https://placeimg.com/400/400/arch" alt="Movie"></figure>
+    <figure><img src="https://picsum.photos/400/400" alt="Movie"></figure>
   @end
   @jrmc.card.body()
     @!jrmc.card.title({ text: 'New movie is released!' })
diff --git a/fractal/components/02-display/carousel/01-carousel.edge b/fractal/components/02-display/carousel/01-carousel.edge
index e96564f..e629f86 100644
--- a/fractal/components/02-display/carousel/01-carousel.edge
+++ b/fractal/components/02-display/carousel/01-carousel.edge
@@ -1,7 +1,7 @@
 @!jrmc.carousel({ items: [
-  { url: 'https://placeimg.com/400/300/arch', alt: 'text alt' },
-  { url: 'https://placeimg.com/400/300/arch' },
-  { url: 'https://placeimg.com/400/300/arch' },
-  { url: 'https://placeimg.com/400/300/arch' },
-  { url: 'https://placeimg.com/400/300/arch' },
+  { url: 'https://picsum.photos/id/400/400/300', alt: 'text alt' },
+  { url: 'https://picsum.photos/id/401/400/300' },
+  { url: 'https://picsum.photos/id/402/400/300' },
+  { url: 'https://picsum.photos/id/403/400/300' },
+  { url: 'https://picsum.photos/id/404/400/300' },
 ] })
diff --git a/fractal/components/02-display/carousel/02-carousel--snap-to-center.edge b/fractal/components/02-display/carousel/02-carousel--snap-to-center.edge
index 393b9f4..da3c609 100644
--- a/fractal/components/02-display/carousel/02-carousel--snap-to-center.edge
+++ b/fractal/components/02-display/carousel/02-carousel--snap-to-center.edge
@@ -1,7 +1,7 @@
 @!jrmc.carousel({ items: [
-  { url: 'https://placeimg.com/400/300/arch' },
-  { url: 'https://placeimg.com/400/300/arch' },
-  { url: 'https://placeimg.com/400/300/arch' },
-  { url: 'https://placeimg.com/400/300/arch' },
-  { url: 'https://placeimg.com/400/300/arch' },
+  { url: 'https://picsum.photos/id/400/400/300' },
+  { url: 'https://picsum.photos/id/401/400/300' },
+  { url: 'https://picsum.photos/id/402/400/300' },
+  { url: 'https://picsum.photos/id/403/400/300' },
+  { url: 'https://picsum.photos/id/404/400/300' },
 ], class: 'carousel-center rounded-box' })
diff --git a/fractal/components/02-display/carousel/03-carousel--snap-to-end.edge b/fractal/components/02-display/carousel/03-carousel--snap-to-end.edge
index 159d01c..5b6f9a7 100644
--- a/fractal/components/02-display/carousel/03-carousel--snap-to-end.edge
+++ b/fractal/components/02-display/carousel/03-carousel--snap-to-end.edge
@@ -1,7 +1,7 @@
 @jrmc.carousel({ class: 'carousel-end rounded-box' })
-  @!jrmc.carousel.item({ url: 'https://placeimg.com/256/400/arch'})
-  @!jrmc.carousel.item({ url: 'https://placeimg.com/256/400/arch' })
-  @!jrmc.carousel.item({ url: 'https://placeimg.com/256/400/arch' })
-  @!jrmc.carousel.item({ url: 'https://placeimg.com/256/400/arch' })
-  @!jrmc.carousel.item({ url: 'https://placeimg.com/256/400/arch' })
+  @!jrmc.carousel.item({ url: 'https://picsum.photos/id/400/256/400'})
+  @!jrmc.carousel.item({ url: 'https://picsum.photos/id/401/256/400' })
+  @!jrmc.carousel.item({ url: 'https://picsum.photos/id/402/256/400' })
+  @!jrmc.carousel.item({ url: 'https://picsum.photos/id/403/256/400' })
+  @!jrmc.carousel.item({ url: 'https://picsum.photos/id/404/256/400' })
 @end
diff --git a/fractal/components/02-display/carousel/04-carousel--with-full-width-items.edge b/fractal/components/02-display/carousel/04-carousel--with-full-width-items.edge
index 20f8dae..be5a415 100644
--- a/fractal/components/02-display/carousel/04-carousel--with-full-width-items.edge
+++ b/fractal/components/02-display/carousel/04-carousel--with-full-width-items.edge
@@ -1,11 +1,11 @@
 @jrmc.carousel({ class: 'w-64 rounded-box' })
   @jrmc.carousel.item({ class: 'w-full' })
-    <img src="https://placeimg.com/256/400/arch" class="w-full" alt="" />
+    <img src="https://picsum.photos/id/400/256/400" class="w-full" alt="" />
   @end
   @jrmc.carousel.item({ class: 'w-full' })
-    <img src="https://placeimg.com/256/400/arch" class="w-full" alt="" />
+    <img src="https://picsum.photos/id/401/256/400" class="w-full" alt="" />
   @end
   @jrmc.carousel.item({ class: 'w-full' })
-    <img src="https://placeimg.com/256/400/arch" class="w-full" alt="" />
+    <img src="https://picsum.photos/id/402/256/400" class="w-full" alt="" />
   @end
 @end
diff --git a/fractal/components/02-display/carousel/05-carousel--vertical.edge b/fractal/components/02-display/carousel/05-carousel--vertical.edge
index 650c4b8..adb01bb 100644
--- a/fractal/components/02-display/carousel/05-carousel--vertical.edge
+++ b/fractal/components/02-display/carousel/05-carousel--vertical.edge
@@ -1,7 +1,7 @@
 @!jrmc.carousel({ items: [
-  { url: 'https://placeimg.com/400/300/arch', class: 'h-full' },
-  { url: 'https://placeimg.com/400/300/arch', class: 'h-full' },
-  { url: 'https://placeimg.com/400/300/arch', class: 'h-full' },
-  { url: 'https://placeimg.com/400/300/arch', class: 'h-full' },
-  { url: 'https://placeimg.com/400/300/arch', class: 'h-full' },
+  { url: 'https://picsum.photos/id/301/400/300', class: 'h-full' },
+  { url: 'https://picsum.photos/id/302/400/300', class: 'h-full' },
+  { url: 'https://picsum.photos/id/308/400/300', class: 'h-full' },
+  { url: 'https://picsum.photos/id/304/400/300', class: 'h-full' },
+  { url: 'https://picsum.photos/id/305/400/300', class: 'h-full' },
 ], class: 'h-96 carousel-vertical rounded-box' })
diff --git a/fractal/components/02-display/carousel/06-carousel--with-half-width-items.edge b/fractal/components/02-display/carousel/06-carousel--with-half-width-items.edge
index d241d12..22b313d 100644
--- a/fractal/components/02-display/carousel/06-carousel--with-half-width-items.edge
+++ b/fractal/components/02-display/carousel/06-carousel--with-half-width-items.edge
@@ -1,17 +1,17 @@
 @jrmc.carousel({ class: 'rounded-box w-96' })
   @jrmc.carousel.item({ class: 'w-1/2' })
-    <img src="https://placeimg.com/256/400/arch" class="w-full" alt="" />
+    <img src="https://picsum.photos/id/400/256/400" class="w-full" alt="" />
   @end
   @jrmc.carousel.item({ class: 'w-1/2' })
-    <img src="https://placeimg.com/256/400/arch" class="w-full" alt="" />
+    <img src="https://picsum.photos/id/401/256/400" class="w-full" alt="" />
   @end
   @jrmc.carousel.item({ class: 'w-1/2' })
-    <img src="https://placeimg.com/256/400/arch" class="w-full" alt="" />
+    <img src="https://picsum.photos/id/402/256/400" class="w-full" alt="" />
   @end
   @jrmc.carousel.item({ class: 'w-1/2' })
-    <img src="https://placeimg.com/256/400/arch" class="w-full" alt="" />
+    <img src="https://picsum.photos/id/403/256/400" class="w-full" alt="" />
   @end
   @jrmc.carousel.item({ class: 'w-1/2' })
-    <img src="https://placeimg.com/256/400/arch" class="w-full" alt="" />
+    <img src="https://picsum.photos/id/404/256/400" class="w-full" alt="" />
   @end
 @end
diff --git a/fractal/components/02-display/carousel/07-carousel--full-bleed.edge b/fractal/components/02-display/carousel/07-carousel--full-bleed.edge
index 2be2931..75a294d 100644
--- a/fractal/components/02-display/carousel/07-carousel--full-bleed.edge
+++ b/fractal/components/02-display/carousel/07-carousel--full-bleed.edge
@@ -1,14 +1,14 @@
 @jrmc.carousel({ class: 'carousel-center max-w-md p-4 space-x-4 bg-neutral rounded-box' })
   @jrmc.carousel.item()
-    <img src="https://placeimg.com/250/180/arch" class="rounded-box" alt="" />
+    <img src="https://picsum.photos/id/400/250/180" class="rounded-box" alt="" />
   @end
   @jrmc.carousel.item()
-    <img src="https://placeimg.com/250/180/arch" class="rounded-box" alt="" />
+    <img src="https://picsum.photos/id/401/250/180" class="rounded-box" alt="" />
   @end
   @jrmc.carousel.item()
-    <img src="https://placeimg.com/250/180/arch" class="rounded-box" alt="" />
+    <img src="https://picsum.photos/id/402/250/180" class="rounded-box" alt="" />
   @end
   @jrmc.carousel.item()
-    <img src="https://placeimg.com/250/180/arch" class="rounded-box" alt="" />
+    <img src="https://picsum.photos/id/403/250/180" class="rounded-box" alt="" />
   @end
 @end
diff --git a/fractal/components/02-display/carousel/08-carousel--with-indicator-button.edge b/fractal/components/02-display/carousel/08-carousel--with-indicator-button.edge
index 570b9cd..494f9ce 100644
--- a/fractal/components/02-display/carousel/08-carousel--with-indicator-button.edge
+++ b/fractal/components/02-display/carousel/08-carousel--with-indicator-button.edge
@@ -1,16 +1,16 @@
 <div>
   @jrmc.carousel({ class: 'w-full' })
     @jrmc.carousel.item({ id: 'item1', class: 'w-full' })
-      <img src="https://placeimg.com/800/200/arch" class="w-full" alt="" />
+      <img src="https://picsum.photos/id/400/800/200" class="w-full" alt="" />
     @end
     @jrmc.carousel.item({ id: 'item2', class: 'w-full' })
-      <img src="https://placeimg.com/800/200/arch" class="w-full" alt="" />
+      <img src="https://picsum.photos/id/401/800/200" class="w-full" alt="" />
     @end
     @jrmc.carousel.item({ id: 'item3', class: 'w-full' })
-      <img src="https://placeimg.com/800/200/arch" class="w-full" alt="" />
+      <img src="https://picsum.photos/id/402/800/200" class="w-full" alt="" />
     @end
     @jrmc.carousel.item({ id: 'item4', class: 'w-full' })
-      <img src="https://placeimg.com/800/200/arch" class="w-full" alt="" />
+      <img src="https://picsum.photos/id/403/800/200" class="w-full" alt="" />
     @end
   @end
 
diff --git a/fractal/components/02-display/carousel/09-carousel--with-next=prev-buttons.edge b/fractal/components/02-display/carousel/09-carousel--with-next=prev-buttons.edge
index e445bc7..5aaeebe 100644
--- a/fractal/components/02-display/carousel/09-carousel--with-next=prev-buttons.edge
+++ b/fractal/components/02-display/carousel/09-carousel--with-next=prev-buttons.edge
@@ -1,27 +1,27 @@
 @jrmc.carousel({ class: 'w-full' })
   @jrmc.carousel.item({ id: 'slide1', class: 'relative w-full' })
-    <img src="https://placeimg.com/800/200/arch" class="w-full" />
+    <img src="https://picsum.photos/id/400/800/200" class="w-full" />
     <div class="absolute flex justify-between transform -translate-y-1/2 left-5 right-5 top-1/2">
       @!jrmc.button.link({ text: '❮', class: 'btn-circle', href: '#slide4' })
       @!jrmc.button.link({ text: '❯', class: 'btn-circle', href: '#slide2' })
     </div>
   @end
   @jrmc.carousel.item({ id: 'slide2', class: 'relative w-full' })
-    <img src="https://placeimg.com/800/200/arch" class="w-full" />
+    <img src="https://picsum.photos/id/401/800/200" class="w-full" />
     <div class="absolute flex justify-between transform -translate-y-1/2 left-5 right-5 top-1/2">
       @!jrmc.button.link({ text: '❮', class: 'btn-circle', href: '#slide1' })
       @!jrmc.button.link({ text: '❯', class: 'btn-circle', href: '#slide3' })
     </div>
   @end
   @jrmc.carousel.item({ id: 'slide3', class: 'relative w-full' })
-    <img src="https://placeimg.com/800/200/arch" class="w-full" />
+    <img src="https://picsum.photos/id/402/800/200" class="w-full" />
     <div class="absolute flex justify-between transform -translate-y-1/2 left-5 right-5 top-1/2">
       @!jrmc.button.link({ text: '❮', class: 'btn-circle', href: '#slide2' })
       @!jrmc.button.link({ text: '❯', class: 'btn-circle', href: '#slide4' })
     </div>
   @end
   @jrmc.carousel.item({ id: 'slide4', class: 'relative w-full' })
-    <img src="https://placeimg.com/800/200/arch" class="w-full" />
+    <img src="https://picsum.photos/id/403/800/200" class="w-full" />
     <div class="absolute flex justify-between transform -translate-y-1/2 left-5 right-5 top-1/2">
       @!jrmc.button.link({ text: '❮', class: 'btn-circle', href: '#slide3' })
       @!jrmc.button.link({ text: '❯', class: 'btn-circle', href: '#slide1' })
diff --git a/fractal/components/02-display/chat/02-chat--avatar.edge b/fractal/components/02-display/chat/02-chat--avatar.edge
index 6c5a471..31cdbfe 100644
--- a/fractal/components/02-display/chat/02-chat--avatar.edge
+++ b/fractal/components/02-display/chat/02-chat--avatar.edge
@@ -1,6 +1,6 @@
 @jrmc.chat()
   @slot('avatar')
-    <img src="https://placeimg.com/192/192/people" />
+    <img src="https://picsum.photos/192/192" />
   @end
   It was said that you would, destroy the Sith, not join them.
 @end
diff --git a/fractal/components/02-display/chat/05-chat--position.edge b/fractal/components/02-display/chat/05-chat--position.edge
index 1fe06cb..acc4e61 100644
--- a/fractal/components/02-display/chat/05-chat--position.edge
+++ b/fractal/components/02-display/chat/05-chat--position.edge
@@ -1,6 +1,6 @@
 @jrmc.chat({ position: 'end' })
   @slot('avatar')
-    <img src="https://placeimg.com/192/192/people" />
+    <img src="https://picsum.photos/192/192" />
   @end
   @slot('header')
     Obi-Wan Kenobi
diff --git a/fractal/components/02-display/chat/07-chat--sample.edge b/fractal/components/02-display/chat/07-chat--sample.edge
index 0a790c9..da31efd 100644
--- a/fractal/components/02-display/chat/07-chat--sample.edge
+++ b/fractal/components/02-display/chat/07-chat--sample.edge
@@ -1,7 +1,7 @@
 <div>
   @jrmc.chat()
     @slot('avatar')
-      <img src="https://placeimg.com/192/192/people" />
+      <img src="https://picsum.photos/192/192" />
     @end
     @slot('header')
       Obi-Wan Kenobi
@@ -15,7 +15,7 @@
 
   @jrmc.chat({ position: 'end', class: 'chat-bubble-accent' })
     @slot('avatar')
-      <img src="https://placeimg.com/192/192/people" />
+      <img src="https://picsum.photos/192/192" />
     @end
     @slot('header')
       Anakin
diff --git a/fractal/components/02-display/toast/10-toast--expiration.edge b/fractal/components/02-display/toast/10-toast--expiration.edge
index e0b706d..a750b77 100644
--- a/fractal/components/02-display/toast/10-toast--expiration.edge
+++ b/fractal/components/02-display/toast/10-toast--expiration.edge
@@ -1,11 +1,11 @@
 <div>
-  @toast({
+  @jrmc.toast({
     'class': 'toast-top toast-end',
     'x-data': '{ open: true }',
     'x-show': 'open',
     'x-transition.duration.500ms': '',
     'x-init': 'setTimeout(() => open = false, 5000);setTimeout(() => $el.remove(), 6000)',
   })
-    @!alert.info({ text: 'New message arrived.', icon: 'false' })
+    @!jrmc.alert.info({ text: 'New message arrived.', icon: 'false' })
   @end
 </div>
diff --git a/fractal/components/02-display/tooltip/01-tooltip.edge b/fractal/components/02-display/tooltip/01-tooltip.edge
index 36b4903..57d0c1c 100644
--- a/fractal/components/02-display/tooltip/01-tooltip.edge
+++ b/fractal/components/02-display/tooltip/01-tooltip.edge
@@ -1,3 +1,3 @@
 @jrmc.tooltip({ text: 'hello' })
-  <img src="https://placeimg.com/192/192/people" />
+  <img src="https://picsum.photos/192/192" />
 @end
diff --git a/fractal/components/02-display/tooltip/02-tooltip--open.edge b/fractal/components/02-display/tooltip/02-tooltip--open.edge
index 05ebabd..6ffa100 100644
--- a/fractal/components/02-display/tooltip/02-tooltip--open.edge
+++ b/fractal/components/02-display/tooltip/02-tooltip--open.edge
@@ -1,3 +1,3 @@
 @jrmc.tooltip({ text: 'hello', class: 'tooltip-open' })
-  <img src="https://placeimg.com/192/192/people" />
+  <img src="https://picsum.photos/192/192" />
 @end
diff --git a/fractal/components/02-display/tooltip/03-tooltip--position.edge b/fractal/components/02-display/tooltip/03-tooltip--position.edge
index 57c6557..8637989 100644
--- a/fractal/components/02-display/tooltip/03-tooltip--position.edge
+++ b/fractal/components/02-display/tooltip/03-tooltip--position.edge
@@ -1,9 +1,9 @@
 @jrmc.tooltip({ text: 'hello', class: 'tooltip-open tooltip-left tooltip-primary' })
-  <img src="https://placeimg.com/64/64/people" />
+  <img src="https://picsum.photos/64/64" />
 @end
 @jrmc.tooltip({ text: 'hello', class: 'tooltip-open tooltip-bottom tooltip-secondary' })
-  <img src="https://placeimg.com/64/64/people" />
+  <img src="https://picsum.photos/64/64" />
 @end
 @jrmc.tooltip({ text: 'hello', class: 'tooltip-open tooltip-right tooltip-accent' })
-  <img src="https://placeimg.com/64/64/people" />
+  <img src="https://picsum.photos/64/64" />
 @end
diff --git a/fractal/components/03-form/01-input/01-input-base.edge b/fractal/components/03-form/01-input/01-input-base.edge
index f6da438..ecb0783 100644
--- a/fractal/components/03-form/01-input/01-input-base.edge
+++ b/fractal/components/03-form/01-input/01-input-base.edge
@@ -1,15 +1,19 @@
 <div class="w-full max-w-xs">
-  @!jrmc.form.input({ placeholder: 'Default', class: 'w-full' })
-  <br /><br />
-  @!jrmc.form.input({ type: 'number', placeholder: '0', class: 'w-full' })
-  <br /><br />
-  @!jrmc.form.input({ type: 'email', placeholder: 'john.snow@got.com', class: 'w-full' })
-  <br /><br />
-  @!jrmc.form.input({ type: 'date', class: 'w-full' })
-  <br /><br />
-  @!jrmc.form.input({ type: 'datetime-local', class: 'w-full' })
-  <br /><br />
-  @!jrmc.form.input({ type: 'color', class: 'w-full' })
-  <br /><br />
-  @!jrmc.form.input({ type: 'hidden', value: 'true', class: 'w-full' })
+  @jrmc.card({ class: 'bg-neutral'})
+    @jrmc.card.body()
+      @!jrmc.form.input({ placeholder: 'Default', class: 'w-full' })
+      <br /><br />
+      @!jrmc.form.input({ type: 'number', placeholder: '0', class: 'w-full' })
+      <br /><br />
+      @!jrmc.form.input({ type: 'email', placeholder: 'john.snow@got.com', class: 'w-full' })
+      <br /><br />
+      @!jrmc.form.input({ type: 'date', class: 'w-full' })
+      <br /><br />
+      @!jrmc.form.input({ type: 'datetime-local', class: 'w-full' })
+      <br /><br />
+      @!jrmc.form.input({ type: 'color', class: 'w-full' })
+      <br /><br />
+      @!jrmc.form.input({ type: 'hidden', value: 'true', class: 'w-full' })
+    @end
+  @end
 </div>
diff --git a/fractal/components/03-form/01-input/04-input-size.edge b/fractal/components/03-form/01-input/04-input-size.edge
index 8c75a44..2c1c026 100644
--- a/fractal/components/03-form/01-input/04-input-size.edge
+++ b/fractal/components/03-form/01-input/04-input-size.edge
@@ -1,10 +1,14 @@
 <div class="w-full max-w-xs">
-  @!jrmc.form.input({ placeholder: 'Size xs',  class: 'input-xs' })
-  <br /><br />
-  @!jrmc.form.input({ placeholder: 'Size sm',  class: 'input-sm' })
-  <br /><br />
-  @!jrmc.form.input({ placeholder: 'Size md',  class: 'input-md' })
-  <br /><br />
-  @!jrmc.form.input({ placeholder: 'Size lg',  class: 'input-lg' })
+  @jrmc.card({ class: 'bg-neutral'})
+    @jrmc.card.body()
+      @!jrmc.form.input({ placeholder: 'Size xs',  class: 'input-xs' })
+      <br /><br />
+      @!jrmc.form.input({ placeholder: 'Size sm',  class: 'input-sm' })
+      <br /><br />
+      @!jrmc.form.input({ placeholder: 'Size md',  class: 'input-md' })
+      <br /><br />
+      @!jrmc.form.input({ placeholder: 'Size lg',  class: 'input-lg' })
+    @end
+  @end
 </div>
 
diff --git a/fractal/components/03-form/01-input/06-input-ghost.edge b/fractal/components/03-form/01-input/06-input-ghost.edge
index c9ed6dc..33ced29 100644
--- a/fractal/components/03-form/01-input/06-input-ghost.edge
+++ b/fractal/components/03-form/01-input/06-input-ghost.edge
@@ -1,4 +1,8 @@
 <div class="w-full max-w-xs">
-  @!jrmc.form.input({ placeholder: 'Ghost',  class: 'input-ghost' })
+  @jrmc.card({ class: 'bg-neutral'})
+    @jrmc.card.body()
+      @!jrmc.form.input({ placeholder: 'Ghost',  class: 'input-ghost' })
+    @end
+  @end
 </div>
 
diff --git a/fractal/components/03-form/02-form-default-values.edge b/fractal/components/03-form/02-form-default-values.edge
index c60aa23..46f8db6 100644
--- a/fractal/components/03-form/02-form-default-values.edge
+++ b/fractal/components/03-form/02-form-default-values.edge
@@ -3,7 +3,7 @@
   confirm: 'ok'
 } })
   @jrmc.form.control({ name: 'firstname' })
-    @!jrmc.form.input()
+    @!jrmc.form.input({ class: 'input-bordered' })
   @end
 
   @jrmc.form.control({ name: 'confirm' })
@@ -15,6 +15,6 @@
   @end
 
   @jrmc.form.control({ name: 'displayname' })
-    @!jrmc.form.input({ value: 'Jerem' })
+    @!jrmc.form.input({ value: 'Jerem', class: 'input-bordered' })
   @end
 @end
diff --git a/fractal/components/03-form/10-error/01-error-default.edge b/fractal/components/03-form/10-error/01-error-default.edge
index 9946d68..6924bb3 100644
--- a/fractal/components/03-form/10-error/01-error-default.edge
+++ b/fractal/components/03-form/10-error/01-error-default.edge
@@ -1,9 +1,9 @@
 @jrmc.form({ method: 'get'})
   @jrmc.form.control({ name: 'sampleError' })
-    @!jrmc.form.input()
+    @!jrmc.form.input({ class: 'input-bordered' })
   @end
 
   @jrmc.form.control({ name: 'sample2Error' })
-    @!jrmc.form.input()
+    @!jrmc.form.input({ class: 'input-bordered' })
   @end
 @end
diff --git a/fractal/components/03-form/10-error/02-error-top.edge b/fractal/components/03-form/10-error/02-error-top.edge
index ee865e8..ac8e26c 100644
--- a/fractal/components/03-form/10-error/02-error-top.edge
+++ b/fractal/components/03-form/10-error/02-error-top.edge
@@ -1,9 +1,9 @@
 @jrmc.form({ method: 'get'})
   @jrmc.form.control({ name: 'sampleError', error: false })
-    @!jrmc.form.input()
+    @!jrmc.form.input({ class: 'input-bordered' })
   @end
 
   @jrmc.form.control({ name: 'sample2Error', error: false })
-    @!jrmc.form.input()
+    @!jrmc.form.input({ class: 'input-bordered' })
   @end
 @end
diff --git a/fractal/components/03-form/10-error/03-error-disabled.edge b/fractal/components/03-form/10-error/03-error-disabled.edge
index 66b83f1..9e2d587 100644
--- a/fractal/components/03-form/10-error/03-error-disabled.edge
+++ b/fractal/components/03-form/10-error/03-error-disabled.edge
@@ -1,9 +1,9 @@
 @jrmc.form({ method: 'get', error: false})
   @jrmc.form.control({ name: 'sampleError' })
-    @!jrmc.form.input()
+    @!jrmc.form.input({ class: 'input-bordered' })
   @end
 
   @jrmc.form.control({ name: 'sample2Error' })
-    @!jrmc.form.input()
+    @!jrmc.form.input({ class: 'input-bordered' })
   @end
 @end
diff --git a/fractal/components/03-form/10-error/04-error-manual.edge b/fractal/components/03-form/10-error/04-error-manual.edge
index 4ef1e4c..cca946a 100644
--- a/fractal/components/03-form/10-error/04-error-manual.edge
+++ b/fractal/components/03-form/10-error/04-error-manual.edge
@@ -1,10 +1,10 @@
 @jrmc.form({ method: 'get', error: false})
   @jrmc.form.control({ name: 'sampleError', error: false })
-    @!jrmc.form.input()
+    @!jrmc.form.input({ class: 'input-bordered' })
   @end
 
   @jrmc.form.control({ name: 'sample2Error', error: false })
-    @!jrmc.form.input()
+    @!jrmc.form.input({ class: 'input-bordered' })
   @end
 
   @!jrmc.form.error.all({ class: 'mt-5'})
diff --git a/fractal/components/03-form/11-input-file/04-input-file-size.edge b/fractal/components/03-form/11-input-file/04-input-file-size.edge
index c240c0e..d3b0604 100644
--- a/fractal/components/03-form/11-input-file/04-input-file-size.edge
+++ b/fractal/components/03-form/11-input-file/04-input-file-size.edge
@@ -1,9 +1,9 @@
 <div class="w-full max-w-xs">
-  @!jrmc.form.file({ class: 'file-input-xs' })
+  @!jrmc.form.file({ class: 'file-input-xs file-input-bordered' })
   <br /><br />
-  @!jrmc.form.file({ class: 'file-input-sm' })
+  @!jrmc.form.file({ class: 'file-input-sm file-input-bordered' })
   <br /><br />
-  @!jrmc.form.file({ class: 'file-input-md' })
+  @!jrmc.form.file({ class: 'file-input-md file-input-bordered' })
   <br /><br />
-  @!jrmc.form.file({ class: 'file-input-lg' })
+  @!jrmc.form.file({ class: 'file-input-lg file-input-bordered' })
 </div>
diff --git a/fractal/components/05-pages/01-login.edge b/fractal/components/05-pages/01-login.edge
index ebeeffb..c9819d6 100644
--- a/fractal/components/05-pages/01-login.edge
+++ b/fractal/components/05-pages/01-login.edge
@@ -3,7 +3,7 @@
 
     @jrmc.card({ class: 'lg:card-side bg-base-100 shadow-xl' })
       @slot('top')
-        <figure><img src="https://placeimg.com/500/500/arch" class="h-full lg:!max-w-fit" alt="" /></figure>
+        <figure><img src="https://picsum.photos/500/500" class="h-full lg:!max-w-fit" alt="" /></figure>
       @end
       @jrmc.card.body()
         @jrmc.form({ csrf: false })
diff --git a/fractal/components/05-pages/02-admin.edge b/fractal/components/05-pages/02-admin.edge
index 585af27..86765cf 100644
--- a/fractal/components/05-pages/02-admin.edge
+++ b/fractal/components/05-pages/02-admin.edge
@@ -13,7 +13,7 @@
           @slot('button')
             @jrmc.button.label({ class: 'btn-ghost btn-circle avatar' })
               <div class="w-10 rounded-full">
-                <img src="https://placeimg.com/80/80/people" />
+                <img src="https://picsum.photos/80/80" />
               </div>
             @end
           @end
@@ -57,7 +57,7 @@
           </div>
         </div>
 
-        @jrmc.table({ full: true })
+        @jrmc.table({ class: 'w-full' })
           @slot('header')
             <tr>
               <th>
@@ -71,15 +71,6 @@
               <th></th>
             </tr>
           @end
-          @slot('footer')
-            <tr>
-              <th></th>
-              <th>Name</th>
-              <th>Job</th>
-              <th>Favorite Color</th>
-              <th></th>
-            </tr>
-          @end
           @slot('body')
             <!-- row 1 -->
             <tr>
diff --git a/fractal/components/_preview.edge b/fractal/components/_preview.edge
index 318a0ae..601d094 100644
--- a/fractal/components/_preview.edge
+++ b/fractal/components/_preview.edge
@@ -1,11 +1,11 @@
 <!DOCTYPE html>
-<html data-theme="dark">
+<html data-theme="light">
 <head>
   <meta charset="utf-8">
   <title>Preview Layout</title>
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
-  <link href="https://cdn.jsdelivr.net/npm/daisyui@3.2.1/dist/full.css" rel="stylesheet" type="text/css" />
+  <link href="https://cdn.jsdelivr.net/npm/daisyui@3.7.6/dist/full.css" rel="stylesheet" type="text/css" />
   <link href="https://cdn.jsdelivr.net/npm/tailwindcss@2.2/dist/tailwind.min.css" rel="stylesheet" type="text/css" />
   <script defer src="https://unpkg.com/alpinejs@3.x.x/dist/cdn.min.js"></script>
 
@@ -16,7 +16,7 @@
       height: 100%
     }
     body {
-      background-image: repeating-linear-gradient(45deg,hsl(var(--b1)),hsl(var(--b1)) 13px,hsl(var(--b2)) 13px,hsl(var(--b2)) 14px);
+      /* background-image: repeating-linear-gradient(45deg,hsl(var(--b1)),hsl(var(--b1)) 13px,hsl(var(--b2)) 13px,hsl(var(--b2)) 14px); */
     }
   </style>
 </head>
diff --git a/fractal/docs/03-changelog.md b/fractal/docs/03-changelog.md
index 408071a..f097167 100644
--- a/fractal/docs/03-changelog.md
+++ b/fractal/docs/03-changelog.md
@@ -1,5 +1,11 @@
 # 1.6.2
 
+- Update daisyUI
+- Update dependencies
+- Fix fractal doc
+
+# 1.6.2
+
 - Fix drawer z-index sidebar
 - Update daisyUI
 
diff --git a/package-lock.json b/package-lock.json
index f4ef5bd..79736e2 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -13,7 +13,7 @@
         "@jrmc/fractal-edge-adapter": "^1.2.2",
         "@poppinss/utils": "^5.0.0",
         "adonis-preset-ts": "^2.1.0",
-        "typescript": "^5.0.4"
+        "typescript": "^5.2.2"
       },
       "peerDependencies": {
         "@adonisjs/core": "^5.9.0",
@@ -8232,16 +8232,16 @@
       }
     },
     "node_modules/typescript": {
-      "version": "5.0.4",
-      "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.0.4.tgz",
-      "integrity": "sha512-cW9T5W9xY37cc+jfEnaUvX91foxtHkza3Nw3wkoF4sSlKn0MONdkdEndig/qPBWXNkmplh3NzayQzCiHM4/hqw==",
+      "version": "5.2.2",
+      "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.2.2.tgz",
+      "integrity": "sha512-mI4WrpHsbCIcwT9cF4FZvr80QUeKvsUsUvKDoR+X/7XHQH98xYD8YHZg7ANtz2GtZt/CBq2QJ0thkGJMHfqc1w==",
       "dev": true,
       "bin": {
         "tsc": "bin/tsc",
         "tsserver": "bin/tsserver"
       },
       "engines": {
-        "node": ">=12.20"
+        "node": ">=14.17"
       }
     },
     "node_modules/ua-parser-js": {
@@ -15422,9 +15422,9 @@
       }
     },
     "typescript": {
-      "version": "5.0.4",
-      "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.0.4.tgz",
-      "integrity": "sha512-cW9T5W9xY37cc+jfEnaUvX91foxtHkza3Nw3wkoF4sSlKn0MONdkdEndig/qPBWXNkmplh3NzayQzCiHM4/hqw==",
+      "version": "5.2.2",
+      "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.2.2.tgz",
+      "integrity": "sha512-mI4WrpHsbCIcwT9cF4FZvr80QUeKvsUsUvKDoR+X/7XHQH98xYD8YHZg7ANtz2GtZt/CBq2QJ0thkGJMHfqc1w==",
       "dev": true
     },
     "ua-parser-js": {
diff --git a/package.json b/package.json
index a280242..f34b9cf 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@jrmc/edge-components",
-  "version": "1.6.2",
+  "version": "1.6.3",
   "description": "",
   "main": "build/index.js",
   "repository": {
@@ -24,12 +24,12 @@
     "@jrmc/fractal-edge-adapter": "^1.2.2",
     "@poppinss/utils": "^5.0.0",
     "adonis-preset-ts": "^2.1.0",
-    "typescript": "^5.0.4"
+    "typescript": "^5.2.2"
   },
   "peerDependencies": {
     "@adonisjs/core": "^5.9.0",
-    "alpinejs": "^3.12.0",
-    "daisyui": "^3.2.0",
+    "alpinejs": "^3.13.0",
+    "daisyui": "^3.7.0",
     "tailwindcss": "^3.3.0"
   },
   "volta": {
diff --git a/views/components/table.edge b/views/components/table.edge
index a222b0f..7470f56 100644
--- a/views/components/table.edge
+++ b/views/components/table.edge
@@ -1,5 +1,5 @@
 <div class="overflow-x-auto{{ $props.has('full') && full ? ' w-full' : '' }}{{ $props.has('height') ? ' h-'+height : '' }}">
-  <table class="{{ jrmc.getCssClass($props, 'table') }} table-{{ $props.has('size') ? $props.get('size') : 'md' }}{{ $props.has('full') && full ? ' w-full' : '' }}{{ $props.has('pinRows') && pinRows ? ' table-pin-rows' : '' }}{{ $props.has('pinCols') && pinCols ? ' table-pin-cols' : '' }}">
+  <table class="{{ jrmc.getCssClass($props, 'table') }} table-{{ $props.has('size') ? $props.get('size') : 'md' }}{{ $props.has('full') && full ? ' w-max' : '' }}{{ $props.has('pinRows') && pinRows ? ' table-pin-rows' : '' }}{{ $props.has('pinCols') && pinCols ? ' table-pin-cols' : '' }}">
     @if($slots.header !== undefined)~
       <thead>{{{ await $slots.header() }}}</thead>
     @end~