İçeriğe geç
English

217 snippet

Snippet Galerisi

Yazıldıkça eklenen gerçek Wind örnekleri. Sonucu görmek ve kodunu okumak için birini aç.

Geliştirici aracı örnekleri

14 örnek, en yeniden eskiye.

  • Flutter File Permission Card with rwx Grid and Octal Mode Readout

    A Flutter file permission card for DevOps dashboards, hosting panels and learning apps: a terminal-style grid of owner, group and other against read, write and execute, bits worth 4, 2 and 1 summing to the octal digits of mode 755, plus the chmod command and the -rwxr-xr-x listing. Built with wind_kit.

    • WDiv
    • WIcon
    • WText
    • WButton
  • Flutter Contrast Checker Card with WCAG AA and AAA Pass Badges

    A WCAG 2.2 colour contrast card for design system and accessibility apps: text and background swatches, a live preview of body and large text, the 3.74:1 ratio on a threshold scale, AA and AAA pass or fail tiles for normal and large text, and a one-tap fix to the nearest passing shade.

    • WDiv
    • WIcon
    • WText
    • WButton
  • Flutter Subnet Calculator Card with 32 Bit Network and Host Grid

    A Flutter subnet calculator card for network and developer tools: an IPv4 address with its CIDR prefix, all 32 bits by octet with network and host bits in two colours, plus network, mask, first and last host, broadcast and usable hosts. A correct /21 worked example built with wind_kit.

    • WDiv
    • WIcon
    • WText
    • WButton
  • Flutter Git Commit Graph Card with Branch Lanes and Merge Lines

    A commit history card for developer tools and Git clients, built with Wind in Flutter. Colour-coded lanes for main, a feature branch and a hotfix fork and merge with right-angle connectors, commit rows carry branch, tag and HEAD chips, and an ahead/behind summary sits above a rebase action.

    • WDiv
    • WIcon
    • WText
    • WButton
  • Flutter Typing Heatmap Card with Colour Coded QWERTY Keys

    A typing analytics card that draws a real staggered QWERTY layout, tinting every key by how often it was pressed, from a cold grey Z to a hot rose E. Built with Wind utility classes over WDynamic: 26 keycaps, a space bar and a five step legend, all plain divs with no canvas and no image assets.

    • WDiv
    • WIcon
    • WText
    • WButton
  • Flutter Code Minimap Card with Viewport Window and Problem Markers

    An editor file overview rendered entirely from Wind utility classes: a syntax tinted minimap of the whole file, a translucent viewport window showing where you are scrolled, and an overview ruler ticking off every error and warning below the fold.

    • WDiv
    • WIcon
    • WText
    • WButton
  • Flutter Frame Profiler Card with Nested Flame Chart Layers

    A performance profiler card that renders a real flame chart: nested call frames stacked by depth, a red frame budget line cutting across the stack, and the hot path picked out in amber. Built with Wind className strings, no charting package and no custom painter.

    • WDiv
    • WIcon
    • WText
    • WButton
  • Flutter Box Model Inspector Card with Nested Spacing Layers

    A DevTools style inspector panel that unpacks a single Wind className into its real geometry: nested margin, border, padding and content layers, each labelled with the utility that produced it. The whole diagram is plain WDiv nesting with Tailwind syntax classNames, no custom painter and no layout maths in Dart.

    • WDiv
    • WIcon
    • WText
    • WButton
  • Flutter VPN Connection Status Card with Server and Speed Stats

    A VPN client status card with a large protected state badge, the active server and its latency, protocol and kill switch rows in a soft inner panel, session and throughput stats, plus a disconnect action. Shows how Wind handles centred column layouts, nested panels and dark-mode inverted buttons.

    • WDiv
    • WText
    • WIcon
    • WButton
  • Flutter CI/CD Deploy Pipeline Status Card with Stage Progress

    A Flutter CI/CD pipeline card for devops dashboards: branch and commit header, running status pill, segmented stage progress bar and build, test, deploy and approve rows with status icons and durations. Built with wind_kit className utilities and dark mode pairs.

    • WDiv
    • WText
    • WIcon
  • Flutter API Key Usage and Rate Limit Card for Developer Tools

    A Flutter API key usage card for developer tools: masked key with a copy action, plan badge, monthly request quota bar, 200 OK and 429 rate-limited endpoint chips, a reset countdown and a manage-keys button. Built with wind_kit className utilities and dark mode pairs.

    • WDiv
    • WText
    • WIcon
    • WButton
  • Flutter Code Snippet Card with Syntax Colors and Copy

    A syntax highlighted code snippet card with a window title bar, a language tag, and a copy button, composed from Wind utility classes. The sample is Wind itself: a className string over a nested widget tree.

    • WDiv
    • WText
    • WButton