Skip to content
Türkçe

217 snippets

Snippet Gallery

Real Wind examples, added as they are written. Open one to see the result and read its code.

Travel and transport snippets

13 snippets, newest first.

  • Flutter Navigation Lights Card with COLREGs Port, Starboard, Masthead and Stern Light Arcs

    A Flutter navigation lights card for boating and marine apps: a night panel with a top-down hull ringed by the COLREGs Rule 21 arcs, red port and green starboard sidelights at 112.5 degrees, a 225 degree masthead ring, a 135 degree sternlight and Rule 22 visibility ranges. Built with wind_kit.

    • WDiv
    • WIcon
    • WText
    • WButton
  • Flutter Runway Markings Card with Designator, Threshold Stripes and Aiming Point

    A Flutter runway markings card for aviation and flight training apps: the approach end of runway 27 drawn to scale, with eight threshold stripes, the designator from a 268 degree heading, a dashed centreline and twin aiming point bars, each called out. Absolute positioning in wind_kit.

    • WDiv
    • WIcon
    • WText
    • WButton
  • Flutter Container Ship Bay Plan Card with Colour Coded Port Stacks

    A Flutter container ship bay plan card for logistics and terminal apps: a row-by-tier cross-section of Bay 14 with port and starboard row numbers, deck tiers above the hatch cover, a tapered hold, slots coloured by discharge port, plugged reefers and a stowage legend. Built with wind_kit.

    • WDiv
    • WIcon
    • WText
    • WButton
  • Flutter Hiking Trail Card with Elevation Profile and Waypoints

    A Flutter hiking trail card for outdoor, trail running and cycling apps: a 34-step elevation profile with a ridge line, markers for trailhead, summit and lake, a distance axis, trip stat tiles, a snow advisory strip and a navigation button. Built with wind_kit className strings only.

    • WDiv
    • WText
    • WIcon
    • WButton
  • Flutter Metro Line Card with Station Route Map and Live Train

    A Flutter metro line card for journey planning apps: route map with station markers, a bend into the return leg, a live train between two stops, service status, headline stats and next departures. Absolute positioning with wind_kit utility classes, no map SDK, no canvas.

    • WDiv
    • WText
    • WIcon
    • WButton
  • Flutter Tire Pressure Card with Four Corner Wheel Readout

    A TPMS panel that maps live psi onto the car itself: four corner tiles around a center chassis, the low tire flagged in amber with the exact top up amount, plus recommended pressure, tire temperature, and the nearest air pump.

    • WDiv
    • WIcon
    • WText
    • WButton
  • Flutter Transit Departure Board Card with Live Line Times

    A live departure board for a transit stop: coloured line-number tiles, destination rows with on time and delayed states, countdown times, a last-updated footnote and a route planner action. A good example of Wind rows that pair a fixed square badge with a two-line label and a right-aligned value.

    • WDiv
    • WIcon
    • WText
    • WButton
  • Flutter Ride Fare Receipt Card with Fare Breakdown

    A ride-hailing fare receipt built with Wind: a completed-trip header, a driver row with star rating, pickup and dropoff stops, an itemized fare breakdown for base, distance, time, booking fee, and tip, a bold total, and the payment method. Dark-mode ready.

    • WDiv
    • WText
    • WIcon
  • Featured

    Flutter Boarding Pass Card with Perforated Stub and Barcode

    A polished airline boarding pass built with Wind: an indigo header with the SFO to NRT route and flight code, a perforated dotted tear line, a passenger plus gate, seat, and boarding key-value grid, and a scannable barcode strip. Dark-mode ready.

    • WDiv
    • WText
    • WIcon
  • Flutter EV Charging Status Card with Battery Progress

    An EV charging status card showing battery percentage, a gradient progress bar, energy added, time remaining, and session cost, with a stop-charging action. Wind-styled with dark-mode support.

    • WDiv
    • WIcon
    • WText
    • WSpacer
    • WButton
  • Flutter Trip Itinerary Day Card with Booking Codes

    A daily travel itinerary card listing timed stops with category icons, confirmation codes, and booking status badges. Great for trip planners and travel concierge apps.

    • WDiv
    • WText
    • WIcon
  • Flutter Place Preview Card with Gradient Map Header

    A venue preview card with a gradient map header and location pin, a rating and distance row, a category badge, and open-now and Wi-Fi attribute pills. Built with Wind's Tailwind-style className and full dark-mode support.

    • WDiv
    • WIcon
    • WText
    • WSpacer