Home / Apps / Embed gallery EMBEDDABLE WIDGETS · NO API KEY · NO COMMISSION
Drop these on your sailing-school site. Every TideLab simulator runs as a self-contained iframe with minimal chrome and a small “Made by TideLab” backlink. Free for non-commercial use; mail us for paid programmes.
HOW TO USE
01 Pick a widget
Each has a live preview and a copy-paste iframe snippet.
02 Paste the snippet
Drop it into your blog, course page, or HTML template.
03 Use any height
Defaults work; tweak height and width to taste.
04 Keep the footer
The “Made by TideLab” line is how we know who's using it.
NAVIGATION LIGHTS
Navigation lights /embed/lights/<slug> Rotational silhouette of 18+ vessel types. Drag to rotate the observer through 360° and watch how the port / starboard / masthead / stern arcs change with bearing.
Power-driven, <50 m H 480 Copy iframe snippet COPY ↗ <iframe src="https://tidelab.io/embed/lights/power-driven" width="100%" height="480" frameborder="0" loading="lazy"></iframe>
Sailing H 480 Copy iframe snippet COPY ↗ <iframe src="https://tidelab.io/embed/lights/sailing" width="100%" height="480" frameborder="0" loading="lazy"></iframe>
Not under command H 480 Copy iframe snippet COPY ↗ <iframe src="https://tidelab.io/embed/lights/nuc" width="100%" height="480" frameborder="0" loading="lazy"></iframe>
Anchored H 480 Copy iframe snippet COPY ↗ <iframe src="https://tidelab.io/embed/lights/anchored" width="100%" height="480" frameborder="0" loading="lazy"></iframe>
Trawling H 480 Copy iframe snippet COPY ↗ <iframe src="https://tidelab.io/embed/lights/trawling" width="100%" height="480" frameborder="0" loading="lazy"></iframe>
Interactive day-shape silhouettes with a rotation slider — diamond / cone / cylinder profiles change with viewing angle. 10 vessel configurations.
Not under command H 540 Copy iframe snippet COPY ↗ <iframe src="https://tidelab.io/embed/shapes/nuc" width="100%" height="540" frameborder="0" loading="lazy"></iframe>
Restricted in manoeuvre H 540 Copy iframe snippet COPY ↗ <iframe src="https://tidelab.io/embed/shapes/ram" width="100%" height="540" frameborder="0" loading="lazy"></iframe>
Towing > 200 m H 540 Copy iframe snippet COPY ↗ <iframe src="https://tidelab.io/embed/shapes/towing" width="100%" height="540" frameborder="0" loading="lazy"></iframe>
Aground H 540 Copy iframe snippet COPY ↗ <iframe src="https://tidelab.io/embed/shapes/aground" width="100%" height="540" frameborder="0" loading="lazy"></iframe>
SOUND SIGNALS
Sound signals /embed/signal/<id> Click play to hear ColRegs sound signals — fog, manoeuvring, anchored, aground. Web-Audio synthesis, no audio files, no licensing.
Power-driven making way H 140 Copy iframe snippet COPY ↗ <iframe src="https://tidelab.io/embed/signal/power-driven-making-way" width="100%" height="140" frameborder="0" loading="lazy"></iframe>
Vessel at anchor H 140 Copy iframe snippet COPY ↗ <iframe src="https://tidelab.io/embed/signal/anchored" width="100%" height="140" frameborder="0" loading="lazy"></iframe>
Vessel aground H 140 Copy iframe snippet COPY ↗ <iframe src="https://tidelab.io/embed/signal/aground" width="100%" height="140" frameborder="0" loading="lazy"></iframe>
Altering to starboard H 140 Copy iframe snippet COPY ↗ <iframe src="https://tidelab.io/embed/signal/alter-starboard" width="100%" height="140" frameborder="0" loading="lazy"></iframe>
Animated radar scope with real-time CPA / TCPA per target. Five collision-avoidance scenarios; click the scope to drop EBL + VRM.
Head-on (Rule 14) H 540
Copy iframe snippet COPY ↗ <iframe src="https://tidelab.io/embed/radar/head-on" width="100%" height="540" frameborder="0" loading="lazy"></iframe>
Crossing — give-way H 540
Copy iframe snippet COPY ↗ <iframe src="https://tidelab.io/embed/radar/crossing-give-way" width="100%" height="540" frameborder="0" loading="lazy"></iframe>
Close CPA (3 targets) H 540
Copy iframe snippet COPY ↗ <iframe src="https://tidelab.io/embed/radar/close-cpa" width="100%" height="540" frameborder="0" loading="lazy"></iframe>
A live Rule-of-Twelfths calculator — set HW and LW heights, drag the hours after high water, and read the height of tide off the falling curve.
Rule-of-Twelfths calculator H 420 Copy iframe snippet COPY ↗ <iframe src="https://tidelab.io/embed/tide" width="100%" height="420" frameborder="0" loading="lazy"></iframe>
Pick the job — a loop, a hitch, a bend, a stopper — and the picker shows the right knot with its diagram and tying steps.
Which-knot picker H 360 Copy iframe snippet COPY ↗ <iframe src="https://tidelab.io/embed/knot" width="100%" height="360" frameborder="0" loading="lazy"></iframe>
CONSTRUCT YOUR OWN URL
Want a widget that isn't listed? We have ~30 vessel light configurations, 10 day-shape vessel types, 12 named sound signals, and 5 radar scenarios. Build the URL.
/embed/lights/<vessel>e.g. /embed/lights/pilot
/embed/shapes/<vessel>e.g. /embed/shapes/fishing
/embed/signal/<id>e.g. /embed/signal/pilot
/embed/radar/<scenario>e.g. /embed/radar/overtaking
/embed/tidee.g. /embed/tide
/embed/knote.g. /embed/knot