Free sea temperature & weather widget for your website
Add a free sea temperature and weather widget to your website in under a minute. Pick from 174 beaches and coastal cities worldwide, copy the embed code, and paste it anywhere on your page – the footer, a sidebar or a blog post. The frosted-glass card blends into any page, adapts its colours to the background and shows its labels in your site's language automatically, so it looks like part of your design. It shows the live water temperature alongside the current air temperature, weather and UV index, works on WordPress, Wix or plain HTML, and updates itself – no sign-up.
Choose a destination
Auto blends into your page – it reads the background and picks light or dark to match.
Preview
This is the real, live card – exactly what your visitors will see.
Copy the code
<!-- Live sea temperature & weather widget by SeaTempMap.com -->
<div class="seatempmap-widget" data-seatempmap-dest="santorini" data-units="c" data-theme="auto">
<a href="https://seatempmap.com/destinations/santorini" rel="noopener">Sea temperature in Santorini · SeaTempMap.com</a>
</div>
<script async src="https://seatempmap.com/widget/v1.js"></script>Paste this wherever you want the card to appear.
Frequently asked questions
How do I add the sea temperature widget to my website?
Pick a destination above, copy the snippet and paste it into your page's HTML wherever the card should appear – the footer, a sidebar or inside a post. There's nothing to install and no account to create: it works in any HTML or embed block on WordPress, Wix, Squarespace, Shopify or a hand-coded site.
Is the widget really free?
Yes – free for personal and commercial sites alike, with no sign-up, no API key and no traffic caps. All we ask is that you keep the small SeaTempMap.com link on the card – that credit is what keeps the widget free.
Where does the data come from, and how often does it update?
Sea temperatures come from NASA satellite data on a 1 km grid – the same reading you see on our world map. Air temperature, weather and UV come from a live global feed, and the card refreshes itself while your page is open – your visitors always see the current conditions.
Will it match my website's design?
The card is frosted glass: it picks up whatever sits behind it and switches between dark and light text on its own, so it stays readable on any colour, photo or section. If you'd rather lock the look, set data-theme to light or dark.
Will the widget conflict with my website's styling?
No – the card renders inside a Shadow DOM, a browser feature that fully isolates it: your theme's CSS can't accidentally break the widget, and the widget's styles can't leak into your page.
Does it show in my visitors' language?
Yes – the card reads your site's language and shows its labels in it automatically, in 30 languages. A French page gets a French card, a German page a German one; anything not covered yet falls back to English.
Will the widget slow my page down?
No – it's one small script (under 20 kB, no dependencies) that loads asynchronously after your content, plus a single tiny data request. And if the data ever can't load, the card fails quietly instead of breaking your layout.
Can I show more than one destination?
Yes – paste one snippet per destination and each card renders on its own, so a hotel with two locations can show both. The script only needs to be included once per page, but a duplicate does no harm.
Which destinations are available?
174 curated beaches and coastal cities worldwide – from the Mediterranean and the Atlantic to the Caribbean, South-East Asia and the Pacific. Search the list above; if yours is missing, email hello@seatempmap.com and we'll look at adding it.
Does it use cookies or collect visitor data?
No – the widget sets no cookies, stores nothing on your visitors' devices and does no tracking – no personal data at all. It only fetches the temperature reading, so it's safe to embed anywhere and won't affect your cookie banner or privacy policy.