Light · Standard (320×170)
<iframe src="https://cinnamonshorehouse.com/embed/beach-conditions" width="340" height="180" style="border:0;max-width:100%" loading="lazy" title="Live Port Aransas beach conditions — Beached Inn"></iframe>A small, fast, no-JavaScript badge you can paste onto any Port Aransas-related page — water temp, air temp, wind, surf, and the next tide, refreshed every 10 minutes straight from NOAA. Built for fishing-guide blogs, vacation-rental managers, restaurant pages, and local tourism sites who want a live conditions block without writing code.
Two themes (light, dark) × two sizes (standard 320×170, compact 260×120). Every variant fits in a 340-pixel-wide column on mobile and scales down gracefully if your container is narrower.
<iframe src="https://cinnamonshorehouse.com/embed/beach-conditions" width="340" height="180" style="border:0;max-width:100%" loading="lazy" title="Live Port Aransas beach conditions — Beached Inn"></iframe><iframe src="https://cinnamonshorehouse.com/embed/beach-conditions?size=compact" width="280" height="130" style="border:0;max-width:100%" loading="lazy" title="Live Port Aransas beach conditions — Beached Inn"></iframe><iframe src="https://cinnamonshorehouse.com/embed/beach-conditions?theme=dark" width="340" height="180" style="border:0;max-width:100%" loading="lazy" title="Live Port Aransas beach conditions — Beached Inn"></iframe><iframe src="https://cinnamonshorehouse.com/embed/beach-conditions?theme=dark&size=compact" width="280" height="130" style="border:0;max-width:100%" loading="lazy" title="Live Port Aransas beach conditions — Beached Inn"></iframe>Why we offer this for free: we run Beached Inn at Cinnamon Shore, a luxury 3-bedroom vacation rental in Port Aransas, and we already maintain the live data feed for our own guests at /beach-conditions. The badge includes a small "Beached Inn →" link back to that page — that backlink is the only thing we ask in return.
If you'd prefer to use the raw data instead of the widget, the same feed is available as JSON at https://cinnamonshorehouse.com/api/beach-conditions with a permissive CORS policy.
No. It's an iframe loading a single static HTML document with all CSS inline and zero JavaScript. The browser loads it lazily (loading="lazy") so it doesn't block your initial render, and it caches for 5 minutes at the CDN edge.
Two themes ship out of the box — light (white background) and dark (navy). The widget is designed to be visually neutral on most sites. For deeper customization, use the JSON feed at /api/beach-conditions and render your own UI.
Please don't — the attribution link is what funds the live data feed. Removing it (or setting display:none on the iframe) violates the implicit terms of free use, and we will eventually add a CSP frame-ancestors check if abuse becomes a problem. Use the JSON feed instead if you want unbranded data.
It's the same NOAA observations and forecasts the National Weather Service publishes — water temperature is from NDBC buoy 42020 (~26 nautical miles SE of the buoy in Corpus Christi Bay), so it's representative of nearshore Gulf water but not exact for the surf line. The conditions pill (Calm / Moderate / Rough) is informational and should never substitute for the on-beach Port Aransas Beach Patrol flag.
Yes — wrap it in <amp-iframe> with the appropriate sandbox and height attributes per AMP's spec. Make sure your AMP page is HTTPS.
The badge is the lightweight version. The full page at cinnamonshorehouse.com/beach-conditions includes the 4-period NWS forecast, today's complete tide schedule, Beach Patrol flag-color guide, and source attribution for every data point.
View full live conditions →