From b725d547a745e4e29c6f20e9d3f52d3e27a9c340 Mon Sep 17 00:00:00 2001
From: Ayo <ayo@ayco.io>
Date: Thu, 14 May 2026 09:21:58 +0200
Subject: [PATCH] chore: add links to example pens

---
 README.md | 8 ++++++--
 1 file changed, 6 insertions(+), 2 deletions(-)

diff --git a/README.md b/README.md
index 76ef41e..86ce1cb 100644
--- a/README.md
+++ b/README.md
@@ -14,6 +14,8 @@ Copy the following to your HTML page:
 </status-indicator>
 ```
 
+See example on CodePen: https://codepen.io/ayo-run/pen/RNorXrK
+
 ## Installation via NPM
 
 If you want to install the library as a node module, you can install the [published package](https://npmx.dev/@ayo-run/status-indicator) and the [base class](https://webcomponent.io) via NPM:
@@ -26,7 +28,7 @@ npm install web-component-base @ayo-run/status-indicator
 pnpm add web-component-base @ayo-run/status-indicator
 ```
 
-## Usage
+## Usage: Imports
 
 Without a bundler that resolves `node_module` imports for you, you can use [import
 maps](https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/script/type/importmap):
@@ -52,7 +54,9 @@ maps](https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/scrip
 </html>
 ```
 
-## Attributes
+Using import maps can also work with the CDN: https://codepen.io/ayo-run/pen/emBdQRg
+
+## Usage: Attributes
 
 ### 1. `status` attribute