{"id":17502620,"url":"https://github.com/rryam/meshingkit","last_synced_at":"2026-03-15T23:58:52.778Z","repository":{"id":257917339,"uuid":"872241061","full_name":"rryam/MeshingKit","owner":"rryam","description":"Ultimate framework to add mesh gradients to your iOS/macOS/visionOS/tvOS and watchOS apps!","archived":false,"fork":false,"pushed_at":"2025-02-25T11:34:43.000Z","size":399,"stargazers_count":55,"open_issues_count":0,"forks_count":1,"subscribers_count":2,"default_branch":"main","last_synced_at":"2025-04-23T03:49:25.054Z","etag":null,"topics":["ios","ios-sdk","macos","mesh-gradient","mesh-gradients","swift-library","swift-package","tvos","visionos","watchos"],"latest_commit_sha":null,"homepage":"","language":"Swift","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/rryam.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":".github/FUNDING.yml","license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null},"funding":{"github":"rryam"}},"created_at":"2024-10-14T05:06:09.000Z","updated_at":"2025-04-21T21:10:30.000Z","dependencies_parsed_at":"2024-11-08T20:00:51.485Z","dependency_job_id":"ca2eb9bb-7ace-4539-a2f7-a63a09e95fdc","html_url":"https://github.com/rryam/MeshingKit","commit_stats":{"total_commits":27,"total_committers":1,"mean_commits":27.0,"dds":0.0,"last_synced_commit":"aa8a6acaa4534dd1ab2a88259fe924e38bdd4011"},"previous_names":["rryam/meshingkit"],"tags_count":3,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rryam%2FMeshingKit","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rryam%2FMeshingKit/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rryam%2FMeshingKit/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/rryam%2FMeshingKit/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/rryam","download_url":"https://codeload.github.com/rryam/MeshingKit/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":250366685,"owners_count":21418768,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["ios","ios-sdk","macos","mesh-gradient","mesh-gradients","swift-library","swift-package","tvos","visionos","watchos"],"created_at":"2024-10-19T21:14:36.944Z","updated_at":"2026-03-15T23:58:52.773Z","avatar_url":"https://github.com/rryam.png","language":"Swift","readme":"# MeshingKit\n\n\n![Gradient](Sources/Resources/gradient.jpg)\n\n![Swift](https://img.shields.io/badge/Swift-6.2-orange.svg)\n![Build Status](https://github.com/rryam/MeshingKit/workflows/Build/badge.svg)\n![Platforms](https://img.shields.io/badge/Platforms-iOS%20%7C%20macOS%20%7C%20tvOS%20%7C%20watchOS%20%7C%20visionOS-blue.svg)\n![License](https://img.shields.io/badge/License-MIT-green.svg)\n![SPM](https://img.shields.io/badge/SPM-compatible-brightgreen.svg)\n\nMeshingKit provides an easy way to create mesh gradients in SwiftUI with predefined gradient templates to directly render beautiful, gorgeous gradients!\n\n## Support\n\nLove this project? Check out my books to explore more of AI and iOS development:\n- [Exploring AI for iOS Development](https://academy.rudrank.com/product/ai)\n- [Exploring AI-Assisted Coding for iOS Development](https://academy.rudrank.com/product/ai-assisted-coding)\n\nYour support helps to keep this project growing!\n\n## Meshing\n\nMeshingKit is based on [Meshing](https://apps.apple.com/in/app/ai-mesh-gradient-tool-meshing/id6567933550), an AI Mesh Gradient Tool.\n\n## Features\n\n- Create beautiful mesh gradients with customizable control points and colors\n- Animate gradients with smooth, configurable transitions\n- 68 predefined gradient templates:\n  - 35 templates with 2x2 grid size\n  - 22 templates with 3x3 grid size\n  - 11 templates with 4x4 grid size\n- Easily extendable for custom gradients\n- Works across all Apple platforms (iOS, macOS, tvOS, watchOS, visionOS)\n\n## Requirements\n\n- iOS 18.0+, macOS 15.0+, tvOS 18.0+, watchOS 11.0+, visionOS 2.0+\n- Swift 6.2+\n- Xcode 16.0+\n\n## Installation\n\n### Swift Package Manager\n\nAdd MeshingKit to your project using Swift Package Manager. In Xcode, go to File \u003e Swift Packages \u003e Add Package Dependency and enter the following URL:\n\n```swift\ndependencies: [\n    .package(url: \"https://github.com/rryam/MeshingKit.git\", from: \"2.4.0\")\n]\n```\n\n## Usage\n\nTo use a predefined gradient template:\n\n```swift\nimport SwiftUI\nimport MeshingKit\n\nstruct ContentView: View {\n    var body: some View {\n        // Using PredefinedTemplate enum (recommended)\n        MeshingKit.gradient(template: .size3(.cosmicAurora))\n            .frame(width: 300, height: 300)\n\n        // Or using specific size methods\n        MeshingKit.gradientSize3(template: .cosmicAurora)\n            .frame(width: 300, height: 300)\n    }\n}\n```\n\n### Using PredefinedTemplate Enum\n\nThe `PredefinedTemplate` enum provides a unified way to access all gradient templates:\n\n```swift\nlet gradient = MeshingKit.gradient(template: .size2(.mysticTwilight))\nlet gradient3 = MeshingKit.gradient(template: .size3(.auroraBorealis))\nlet gradient4 = MeshingKit.gradient(template: .size4(.cosmicNebula))\n```\n\n## Animated Gradient Views\n\nTo create an animated gradient view:\n\n```swift\nimport SwiftUI\nimport MeshingKit\n\nstruct AnimatedGradientView: View {\n    @State private var showAnimation = true\n\n    var body: some View {\n        MeshingKit.animatedGradient(\n            .size3(.cosmicAurora),\n            showAnimation: $showAnimation,\n            animationSpeed: 1.5\n        )\n        .frame(width: 300, height: 300)\n        .padding()\n\n        // Toggle animation\n        Toggle(\"Animate Gradient\", isOn: $showAnimation)\n            .padding()\n    }\n}\n```\n\n\u003e **Note:** Animation is only available for 3x3 and 4x4 grid templates. 2x2 templates cannot be animated because all four points are corner points that must remain fixed at the edges of the gradient.\n\n## Custom Animation Patterns\n\nMeshingKit provides advanced animation control through `AnimationPattern` and `PointAnimation` structures:\n\n```swift\nimport SwiftUI\nimport MeshingKit\n\nstruct CustomAnimationView: View {\n    @State private var showAnimation = true\n\n    var body: some View {\n        // Use default animation pattern\n        MeshingKit.animatedGradient(\n            .size3(.cosmicAurora),\n            showAnimation: $showAnimation,\n            animationSpeed: 1.0\n        )\n        .frame(width: 300, height: 300)\n    }\n}\n```\n\n### Creating Custom Animation Patterns\n\nYou can create custom animations by defining specific point movements:\n\n```swift\n// Create custom point animations\nlet pointAnimations = [\n    PointAnimation(pointIndex: 1, axis: .x, amplitude: 0.3, frequency: 1.2),\n    PointAnimation(pointIndex: 4, axis: .both, amplitude: 0.2, frequency: 0.8),\n    PointAnimation(pointIndex: 7, axis: .y, amplitude: -0.4, frequency: 1.5)\n]\n\nlet customPattern = AnimationPattern(animations: pointAnimations)\n\n// Apply the pattern to an animated gradient\nMeshingKit.animatedGradient(\n    .size3(.cosmicAurora),\n    showAnimation: $showAnimation,\n    animationSpeed: 1.0,\n    animationPattern: customPattern\n)\n```\n\n**Animation Parameters:**\n- `pointIndex`: Index of the point to animate in the gradient's position array\n- `axis`: Which axis to animate (`.x`, `.y`, or `.both`)\n- `amplitude`: How far the point moves from its original position\n- `frequency`: Speed multiplier for the animation (default: 1.0)\n\n## Noise Effect with Gradients\n\nYou can add a noise effect to your gradients using the ParameterizedNoiseView:\n\n```swift\nimport SwiftUI\nimport MeshingKit\n\nstruct NoiseEffectGradientView: View {\n    @State private var intensity: Float = 0.5\n    @State private var frequency: Float = 0.2\n    @State private var opacity: Float = 0.9\n\n    var body: some View {\n        ParameterizedNoiseView(intensity: $intensity, frequency: $frequency, opacity: $opacity) {\n            MeshingKit.gradientSize3(template: .cosmicAurora)\n        }\n        .frame(width: 300, height: 300)\n\n        // Controls for adjusting the noise effect\n        VStack {\n            Slider(value: $intensity, in: 0...1) {\n                Text(\"Intensity\")\n            }\n            .padding()\n\n            Slider(value: $frequency, in: 0...1) {\n                Text(\"Frequency\")\n            }\n            .padding()\n\n            Slider(value: $opacity, in: 0...1) {\n                Text(\"Opacity\")\n            }\n            .padding()\n        }\n    }\n}\n```\n\n## Available Gradient Templates\n\nMeshingKit provides 68 predefined gradient templates organized by grid size:\n\n### Exploring Templates Programmatically\n\nYou can explore all available templates using the `CaseIterable` conformance:\n\n```swift\n// List all 3x3 templates\nfor template in GradientTemplateSize3.allCases {\n    print(template.name)\n}\n\n// Get total count of templates for each size\nlet size2Count = GradientTemplateSize2.allCases.count\nlet size3Count = GradientTemplateSize3.allCases.count\nlet size4Count = GradientTemplateSize4.allCases.count\n```\n\n### Searching Templates\n\nYou can search across template names, tags, and moods using `PredefinedTemplate.find(by:)`:\n\n```swift\n// Find templates by keyword\nlet matches = PredefinedTemplate.find(by: \"aurora\")\n\n// Inspect metadata\nif let first = matches.first {\n    print(first.tags)\n    print(first.moods)\n    print(first.palette)\n}\n```\n\n### Popular Template Examples\n\n**2x2 Grid Templates (35 total):**\n- mysticTwilight, tropicalParadise, cherryBlossom, arcticFrost\n- goldenSunrise, emeraldForest, desertMirage, midnightGalaxy\n- autumnHarvest\n\n**3x3 Grid Templates (22 total):**\n- intelligence, auroraBorealis, sunsetGlow, oceanDepths\n- neonNight, autumnLeaves, cosmicAurora, lavaFlow\n- etherealMist, tropicalParadise, midnightGalaxy, desertMirage\n- frostedCrystal, enchantedForest, rubyFusion, goldenSunrise\n- cosmicNebula, arcticAurora, volcanicEmber, mintBreeze\n- twilightSerenade, saharaDunes\n\n**4x4 Grid Templates (11 total):**\n- auroraBorealis, sunsetHorizon, mysticForest, cosmicNebula\n- coralReef, etherealTwilight, volcanicOasis, arcticFrost\n- jungleMist, desertMirage, neonMetropolis\n\n### Finding Templates by Name\n\nSince templates follow `camelCase` naming, you can easily find them:\n\n```swift\n// Create a gradient from any template name\nlet template = GradientTemplateSize3.auroraBorealis\nlet gradient = MeshingKit.gradient(template: template)\n```\n\n## Custom Gradients\n\nCreate custom gradients by defining your own `GradientTemplate`:\n\n```swift\nlet customTemplate = CustomGradientTemplate(\n    name: \"Custom Gradient\",\n    size: 3,\n    points: [\n        .init(x: 0.0, y: 0.0), .init(x: 0.5, y: 0.0), .init(x: 1.0, y: 0.0),\n        .init(x: 0.0, y: 0.5), .init(x: 0.5, y: 0.5), .init(x: 1.0, y: 0.5),\n        .init(x: 0.0, y: 1.0), .init(x: 0.5, y: 1.0), .init(x: 1.0, y: 1.0)\n    ],\n    colors: [\n        Color.red, Color.orange, Color.yellow,\n        Color.green, Color.blue, Color.indigo,\n        Color.purple, Color.pink, Color.white\n    ],\n    background: Color.black\n)\n\nlet customGradient = MeshingKit.gradient(template: customTemplate)\n```\n\n## Advanced Animation Examples\n\n### Speed Control and Pausing\n\n```swift\nstruct AdvancedAnimationView: View {\n    @State private var showAnimation = true\n    @State private var animationSpeed: Double = 1.0\n\n    var body: some View {\n        VStack {\n            MeshingKit.animatedGradient(\n                .size4(.cosmicNebula),\n                showAnimation: $showAnimation,\n                animationSpeed: animationSpeed\n            )\n            .frame(width: 400, height: 400)\n\n            // Animation controls\n            VStack {\n                Toggle(\"Enable Animation\", isOn: $showAnimation)\n\n                Slider(value: $animationSpeed, in: 0.1...3.0) {\n                    Text(\"Animation Speed: \\(animationSpeed, specifier: \"%.1f\")x\")\n                }\n            }\n            .padding()\n        }\n    }\n}\n```\n\n### Combining Animation with Noise Effects\n\n```swift\nstruct AnimatedNoiseGradientView: View {\n    @State private var showAnimation = true\n    @State private var intensity: Float = 0.3\n    @State private var frequency: Float = 0.2\n\n    var body: some View {\n        ParameterizedNoiseView(\n            intensity: $intensity,\n            frequency: $frequency,\n            opacity: .constant(0.8)\n        ) {\n            MeshingKit.animatedGradient(\n                .size3(.auroraBorealis),\n                showAnimation: $showAnimation,\n                animationSpeed: 1.2\n            )\n        }\n        .frame(width: 300, height: 300)\n    }\n}\n```\n\n## Hex Color Initialization\n\nThere is an extension on `Color` that allows to initialise colors using hexadecimal strings:\n\n```swift\nlet color = Color(hex: \"#FF5733\")\n```\n\nThis extension supports various hex formats:\n\n- \"#RGB\" (12-bit)\n- \"#RRGGBB\" (24-bit)\n- \"#AARRGGBB\" (32-bit with alpha)\n\n## Export Helpers\n\nMeshingKit includes helpers to export previews and snippets for design tools:\n\n```swift\n// Snapshot a mesh gradient (CGImage)\nlet image = MeshingKit.snapshotCGImage(\n    template: GradientTemplateSize3.auroraBorealis,\n    size: CGSize(width: 600, height: 600)\n)\n\n// Generate SwiftUI Gradient.Stop snippet\nlet swiftUIStops = MeshingKit.swiftUIStopsSnippet(\n    template: GradientTemplateSize3.auroraBorealis\n)\n\n// Generate CSS linear-gradient preview\nlet css = MeshingKit.cssLinearGradientSnippet(\n    template: GradientTemplateSize3.auroraBorealis\n)\n```\n\n## Video Export\n\nExport animated mesh gradients to MP4 files with quality controls:\n\n```swift\nlet config = VideoExportConfiguration(\n    size: CGSize(width: 1080, height: 1080),\n    duration: 5.0,\n    frameRate: 30,\n    blurRadius: 0,\n    showDots: false,\n    animate: true,\n    smoothsColors: true,\n    renderScale: 2.0\n)\n\nlet url = try await MeshingKit.exportVideo(\n    template: .size3(.auroraBorealis),\n    configuration: config\n)\n```\n\nYou can also use the parameter overload:\n\n```swift\nlet url = try await MeshingKit.exportVideo(\n    template: .size3(.auroraBorealis),\n    size: CGSize(width: 1080, height: 1080),\n    duration: 5.0,\n    frameRate: 30,\n    renderScale: 2.0\n)\n```\n\n### Video Export Configuration\n\n| Setting | Description | Notes |\n| --- | --- | --- |\n| `size` | Output view size in points. | Required. |\n| `duration` | Video length in seconds. | Default: 5.0 |\n| `frameRate` | Frames per second. | Default: 30 |\n| `blurRadius` | Blur applied to each frame. | Default: 0 |\n| `showDots` | Show control points as dots. | Default: false |\n| `animate` | Animate control points. | Default: true |\n| `smoothsColors` | Smooth color transitions. | Default: true |\n| `renderScale` | Render scale multiplier for output resolution. | Default: 1.0 |\n\n\u003e Tip: Increase `renderScale` for sharper output without changing layout size.\n\n## Contributing\n\nContributions to MeshingKit are welcome! Please feel free to submit a Pull Request.\n\n## License\n\nMeshingKit is available under the MIT license. See the LICENSE file for more info.\n\n[![Star History Chart](https://api.star-history.com/svg?repos=rryam/MeshingKit\u0026type=Date)](https://star-history.com/#rryam/MeshingKit\u0026Date)\n","funding_links":["https://github.com/sponsors/rryam"],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Frryam%2Fmeshingkit","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Frryam%2Fmeshingkit","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Frryam%2Fmeshingkit/lists"}