A component to practice on

This coastal weather card is plain HTML and CSS, made for Layerwake. Capture it with the extension to run the whole loop yourself.

Harbor forecastLow swell

Calm seas until dusk

Light westerly wind, a clear horizon and a slow incoming tide.

14°Water
9 knWind
0.6 mSwell
Updated 6 min ago

Capture it

  1. Click the Layerwake toolbar button, then Capture component.
  2. Hover the card until the outline wraps all of it, and click.
  3. Check the summary, then choose Download Layerwake JSON.
  4. Open the workspace and import the file.

No extension yet?

The same card ships as a ready-made capture. Try the demo to skip straight to inspecting and rebuilding.

To install the extension, run npm run build:extension and load extension/dist as an unpacked extension. The README has the full steps.