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.

Latest snippets

217 snippets, newest first.

  • 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 Domino Score Card with Pip Tile Rack

    A Flutter domino score card for board game and party apps: a tile rack with pip faces, the playable double highlighted, a boneyard draw tile, a head-to-head score strip with a race-to-150 bar and round stats. Absolutely positioned pips with wind_kit utility classes.

    • WDiv
    • WText
    • WIcon
    • WButton
  • Flutter Tournament Bracket Card with Semi Final Matchups

    A knockout bracket card for sports and esports apps: seeded team rows with scores, losing sides dimmed, real bracket connectors drawn from side borders, the two finalists aligned to each pair and a dark final strip with kickoff time and venue. Built with Wind utility classes and complete dark mode pairs.

    • 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 Glucose Monitor Card with Continuous Trend Line

    A continuous glucose monitoring card for health and wearable apps: a 24 hour dot trend line plotted over a shaded target range, amber markers on every reading above 180 mg/dL, time in range and average tiles, and a spike callout. Built with Wind utility classes, complete dark mode pairs and no charting package.

    • WDiv
    • WText
    • WIcon
    • WButton
  • Flutter Portfolio Allocation Card with Weighted Treemap Tiles

    A holdings breakdown where every tile is sized by its share of the portfolio, so the biggest position is literally the biggest rectangle. Nine positions tile edge to edge across three weighted rows, with asset class totals below and a drift warning strip. Each tile is a fixed size Wind div, no chart library involved.

    • WDiv
    • WText
    • WIcon
    • WButton
  • Flutter Class Schedule Card with Time Blocked Day Columns

    A Flutter weekly class schedule card with time on the vertical axis: five day columns, class blocks sized by start time and duration, colour-coded types with a legend, an hour axis and a next-class strip with spots left. Pure wind_kit className layout, no charting package.

    • WDiv
    • WText
    • WIcon
    • WButton
  • Flutter Piano Chord Trainer Card with Highlighted Keys

    A Flutter piano chord trainer card for music lesson apps: ten white keys, seven absolutely positioned black keys, chord notes highlighted, root, third, fifth and seventh tiles and a weekly accuracy stat. Every key is a wind_kit styled div, no custom painter.

    • WDiv
    • WText
    • WIcon
    • WButton
  • Flutter Focus Timer Card with Radial Minute Dial

    A deep-work session card that turns the remaining minutes into a ring of 25 dots, one per minute, with the countdown in the middle. Round pills track the pomodoro cycle and two tiles summarise focused time and streak. Built with Wind className utilities, so the whole dial is plain divs.

    • WDiv
    • WText
    • WIcon
    • WButton
  • Flutter A/B Test Results Card with Mirrored Variant Bars

    An experiment readout where control and variant grow away from a shared centre axis, one metric per row, so which side wins is obvious before you read a single number. Ends with the projected revenue lift and a ship decision.

    • WDiv
    • WText
    • WIcon
    • WButton
  • Flutter Feature Prioritization Card with Impact Effort Quadrant Plot

    A roadmap card that plots ten candidate features on an impact versus effort field, split into quick wins, big bets, fill ins and time sinks. Each dot is placed at a real pixel offset, so the quadrant a feature lands in is the recommendation.

    • WDiv
    • WText
    • WButton
  • Flutter Conversion Funnel Card with Narrowing Stage Bars

    A checkout funnel card where each stage is a centred bar scaled to its true share of traffic, so the drop off is visible as a shape rather than a number. Between the bars sit the exact losses, and the footer calls out the biggest leak in the flow.

    • WDiv
    • WText
    • WIcon
    • WButton