nhw-robotis · Oct 12, 2026 · Oct 1, 2026 · Oct 2, 2026 · Oct 2, 2026 · Oct 2, 2026
diff --git a/docusaurus/docs/systems/hx5_d20/specifications/hardware.mdx b/docusaurus/docs/systems/hx5_d20/specifications/hardware.mdx
@@ -1,5 +1,7 @@
 import Tabs from '@theme/Tabs';
 import TabItem from '@theme/TabItem';
+import HXUrdfViewer from '@site/src/components/HXUrdfViewer';
+import {HX5_D20_RIGHT_VIEWER} from '@site/src/components/HXUrdfViewer/presets';
 
 # ROBOTIS Hand
 
@@ -15,6 +17,10 @@ High-DOF multi-finger robot hands designed for AI Worker / OMY platforms.
 <Tabs groupId="robot-type">
 <TabItem value="hx5-d20" label="HX5-D20">
 
+<div style={{marginBottom: '2rem'}}>
+  <HXUrdfViewer {...HX5_D20_RIGHT_VIEWER} />
+</div>
+
 ### Main Specifications
 
 | Item                      | Specification                                   |

diff --git a/docusaurus/docs/systems/hx_friends/index.mdx b/docusaurus/docs/systems/hx_friends/index.mdx
@@ -0,0 +1,130 @@
+import HXUrdfViewer from '@site/src/components/HXUrdfViewer';
+import HXFriendsClip from '@site/src/components/HXFriendsClip';
+import {
+  HX1_VIEWER,
+  HX3_D11_RIGHT_VIEWER,
+  HX4_D12_RIGHT_VIEWER,
+  HX5_D20_RIGHT_VIEWER,
+} from '@site/src/components/HXUrdfViewer/presets';
+
+# HX Friends
+
+HX Friends is a collection of robot hand designs built on the **[DYNAMIXEL](/docs/dxl/model_reference/)** ecosystem.
+
+The [Community Showcase](/docs/common/ecosystem) shows how individuals, universities, and companies already use DYNAMIXEL actuators to build open-source robots — including many robotic hands. HX Friends continues that idea: explore diverse hand layouts on the same modular foundation, then invent your own.
+
+## Why the DYNAMIXEL Ecosystem
+
+| Strength | What it means for hand builders |
+| :------- | :------------------------------ |
+| **Versatile actuators** | One actuator family scales from a simple finger or gripper to high-DOF anthropomorphic hands and full robot platforms |
+| **Open-source culture** | Labs and companies publish DYNAMIXEL-based designs and tools you can study, remix, and extend |
+| **Proven for hands** | Peer projects such as MIDAS Hand, Orca Hand, Leap Hand, House of Dextra, OpenHand, and others already choose DYNAMIXEL for dexterous manipulation |
+| **Modular building blocks** | Familiar protocols and replaceable joints keep designs maintainable as you iterate |
+| **Global community** | A worldwide network of makers and researchers sharing projects proudly **Powered by DYNAMIXEL** |
+
+Together, these strengths give you an **open, modular, and practical** path to invent the hand that fits your robot and your problem.
+
+## HX Friends: HX5-D20
+
+- **Type**: Hand
+- **Features**: A **20 DOF** anthropomorphic reference with a thumb and four fingers — useful when you want to explore human-like coverage and fine multi-finger coordination.
+- **Components**
+  - Twenty [DYNAMIXEL XM335-T323-T](/docs/dxl/model_reference/x_series/xm_series/xm335-t323)
+  - Five tactile sensors at the fingertips
+
+<HXFriendsClip
+  title="HX5-D20 clips"
+  clips={[
+    {src: '/videos/systems/hx_friends/hx5_preset.gif', caption: 'Preset Movements'},
+    {src: '/videos/systems/hx_friends/hx5_vr.gif', caption: 'VR Teleoperation'},
+  ]}
+/>
+
+<HXUrdfViewer {...HX5_D20_RIGHT_VIEWER} />
+
+## HX Friends: HX4-D12
+
+- **Type**: Hand
+- **Features**: A **12 DOF** design with a thumb and three fingers — a middle ground between dexterity and mechanical simplicity.
+- **Components**
+  - Twelve [DYNAMIXEL XM335-T323-T](/docs/dxl/model_reference/x_series/xm_series/xm335-t323)
+  - Four tactile sensors at the fingertips
+
+<HXFriendsClip
+  title="HX4-D12 clips"
+  clips={[
+    {src: '/videos/systems/hx_friends/hx4_preset.gif', caption: 'Preset Movements'},
+    {src: '/videos/systems/hx_friends/hx4_vr.gif', caption: 'VR Teleoperation'},
+  ]}
+/>
+
+<HXUrdfViewer {...HX4_D12_RIGHT_VIEWER} />
+
+## HX Friends: HX3-D11
+
+- **Type**: Hand
+- **Features**: An **11 DOF** three-finger reference — a more compact multi-finger option with fewer parts to manage.
+- **Components**
+  - Eleven [DYNAMIXEL XM335-T323-T](/docs/dxl/model_reference/x_series/xm_series/xm335-t323)
+  - Three tactile sensors at the fingertips
+
+<HXFriendsClip
+  title="HX3-D11 clips"
+  clips={[
+    {src: '/videos/systems/hx_friends/hx3_preset.gif', caption: 'Preset Movements'},
+    {src: '/videos/systems/hx_friends/hx3_vr.gif', caption: 'VR Teleoperation'},
+  ]}
+/>
+
+<HXUrdfViewer {...HX3_D11_RIGHT_VIEWER} />
+
+## HX Friends: HX2-D01
+
+- **Type**: Gripper
+- **Features**: A gripper built with **[XM430-W210-R](/docs/dxl/model_reference/x_series/xm_series/xm430-w210)** — an example of using a different DYNAMIXEL series for a simpler, robust grasp form factor.
+- **Components**
+  - One [DYNAMIXEL XM430-W210-R](/docs/dxl/model_reference/x_series/xm_series/xm430-w210)
+
+<HXFriendsClip
+  title="HX2-D1-X clip"
+  clips={[
+    {src: '/videos/systems/hx_friends/hx2_motion.gif', caption: 'Gripper Motion'},
+  ]}
+/>
+
+:::info
+Interactive 3D model coming soon.
+:::
+
+## HX Friends: HX1-D03
+
+- **Type**: Finger
+- **Features**: A **3 DOF** all-pitch finger — a minimal block for studying joint stacking and finger motion before you scale to a full hand.
+- **Components**
+  - Three [DYNAMIXEL XM335-T323-T](/docs/dxl/model_reference/x_series/xm_series/xm335-t323)
+  - One tactile sensor at the tip
+
+<HXFriendsClip
+  title="HX1-D3 clips"
+  clips={[
+    {src: '/videos/systems/hx_friends/hx1_wave.gif', caption: 'Wave Motion'},
+    {src: '/videos/systems/hx_friends/hx1_grasp.gif', caption: 'Grasp Motion'},
+  ]}
+/>
+
+<HXUrdfViewer {...HX1_VIEWER} />
+
+## Get Inspired
+
+Use these designs as references, not rules. Pose the joints, compare layouts, and notice how actuator choice and DOF change the feel of a hand.
+
+Then invent something we have not shown: a new finger arrangement, a lighter gripper, a task-specific mechanism, or a hybrid that only your application needs. The best next HX Friend is the one you create.
+
+## Explore More from the Community
+
+HX Friends is one slice of a larger DYNAMIXEL world. See what universities, companies, and makers are already building — and bring your own project into that circle.
+
+→ **[Community Showcase / Ecosystem](/docs/common/ecosystem)**
+
+You can also dig into ROBOTIS Hand open-source resources: [Open Source](/docs/systems/hx5_d20/resources/open_source) · [Discord](https://discord.gg/robotis)
diff --git a/docusaurus/docs/systems/turtlebot3/friends.mdx b/docusaurus/docs/systems/turtlebot3/friends.mdx
@@ -1,4 +1,4 @@
-# Locomotion
+# TurtleBot3 Friends
 The contents in e-Manual are subject to be updated without a prior notice. Therefore, some video may differ from the contents in e-Manual.
 
 

diff --git a/docusaurus/docusaurus.config.ts b/docusaurus/docusaurus.config.ts
@@ -274,6 +274,10 @@ const config: Config = {
                           <div class="mega-menu__product-thumb"><img src="/img/mega-menu/hx5-d20.webp" alt="HX5-D20" /></div>
                           <span>HX5-D20</span>
                         </a>
+                        <a class="mega-menu__product" href="/docs/systems/hx_friends/">
+                          <div class="mega-menu__product-thumb"><img src="/img/mega-menu/hx_friends.png" alt="HX Friends" /></div>
+                          <span>HX Friends</span>
+                        </a>
                         <a class="mega-menu__product" href="/docs/systems/rh_p12_rn/">
                           <div class="mega-menu__product-thumb"><img src="/img/mega-menu/rh-p12-rn.webp" alt="RH-P12-RN(A)" /></div>
                           <span>RH-P12-RN(A)</span>

diff --git a/docusaurus/sidebars.ts b/docusaurus/sidebars.ts
@@ -11,6 +11,7 @@ import {dxlSidebar, protocolSidebar} from './sidebars/dxl';
 import eduSidebar from './sidebars/edu';
 import faqSidebar from './sidebars/faq';
 import hx5d20Sidebar from './sidebars/hx5d20';
+import hxFriendsSidebar from './sidebars/hxFriends';
 import op3Sidebar from './sidebars/op3';
 import omySidebar from './sidebars/omy';
 import omxSidebar from './sidebars/omx';
@@ -34,6 +35,7 @@ const sidebars: SidebarsConfig = {
   op3Sidebar,
   thormang3Sidebar,
   hx5d20Sidebar,
+  hxFriendsSidebar,
   rhp12rnaSidebar,
   rhp12rnurSidebar,
   omySidebar,

diff --git a/docusaurus/sidebars/hxFriends.ts b/docusaurus/sidebars/hxFriends.ts
@@ -0,0 +1,7 @@
+import type {SidebarsConfig} from '@docusaurus/plugin-content-docs';
+
+const hxFriendsSidebar: SidebarsConfig[string] = [
+  {type: 'doc', id: 'systems/hx_friends/index', label: 'HX Friends'},
+];
+
+export default hxFriendsSidebar;
diff --git a/docusaurus/src/components/HXFriendsClip/index.tsx b/docusaurus/src/components/HXFriendsClip/index.tsx
@@ -0,0 +1,37 @@
+import React from 'react';
+import './styles.css';
+
+export type HXFriendsClipItem = {
+  src: string;
+  caption: string;
+  alt?: string;
+};
+
+export type HXFriendsClipProps = {
+  /** Accessible title for the clip group */
+  title: string;
+  /** One or more GIFs shown in a row */
+  clips: HXFriendsClipItem[];
+};
+
+export default function HXFriendsClip({title, clips}: HXFriendsClipProps): React.JSX.Element {
+  return (
+    <div className="hx-friends-clip" aria-label={title}>
+      <div className={`hx-friends-clip__row hx-friends-clip__row--${Math.min(clips.length, 3)}`}>
+        {clips.map((clip) => (
+          <figure key={`${clip.src}-${clip.caption}`} className="hx-friends-clip__item">
+            <div className="hx-friends-clip__frame">
+              <img
+                className="hx-friends-clip__gif"
+                src={clip.src}
+                alt={clip.alt || `${title} — ${clip.caption}`}
+                loading="lazy"
+              />
+            </div>
+            <figcaption className="hx-friends-clip__caption">{clip.caption}</figcaption>
+          </figure>
+        ))}
+      </div>
+    </div>
+  );
+}
diff --git a/docusaurus/src/components/HXFriendsClip/styles.css b/docusaurus/src/components/HXFriendsClip/styles.css
@@ -0,0 +1,64 @@
+.hx-friends-clip {
+  width: 100%;
+  margin: 1rem 0 1.35rem;
+}
+
+.hx-friends-clip__row {
+  display: grid;
+  gap: 1.25rem;
+  align-items: start;
+}
+
+.hx-friends-clip__row--1 {
+  grid-template-columns: minmax(0, 720px);
+}
+
+.hx-friends-clip__row--2 {
+  grid-template-columns: repeat(2, minmax(0, 1fr));
+}
+
+.hx-friends-clip__row--3 {
+  grid-template-columns: repeat(3, minmax(0, 1fr));
+}
+
+.hx-friends-clip__item {
+  margin: 0;
+  min-width: 0;
+}
+
+.hx-friends-clip__frame {
+  position: relative;
+  width: 100%;
+  aspect-ratio: 16 / 9;
+  overflow: hidden;
+  border: 1px solid #d8dee8;
+  border-radius: 10px;
+  background: #0f172a;
+  box-shadow: 0 10px 28px rgba(15, 23, 42, 0.08);
+}
+
+.hx-friends-clip__gif {
+  position: absolute;
+  inset: 0;
+  display: block;
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+}
+
+.hx-friends-clip__caption {
+  margin: 0.55rem 0 0;
+  color: #475569;
+  font-size: 0.88rem;
+  font-weight: 650;
+  line-height: 1.35;
+  text-align: center;
+}
+
+@media (max-width: 720px) {
+  .hx-friends-clip__row--2,
+  .hx-friends-clip__row--3 {
+    grid-template-columns: 1fr;
+    gap: 1rem;
+  }
+}