# CushyStudio **CushyStudio** is the go-to platform for easy generative AI use, empowering creatives of any level to effortlessly create stunning images, videos, and 3D models. **What You'll Love:** * **CushyApps**: A collection of visual tools tailored for different artistic tasks. Simplify your AI art creation process and have fun exploring a wide range of versatile to niche tools in the Cushy Library. * **CushyKit:** Speed up your projects with our extensive toolkit for custom apps development and task automation. Quickly design interfaces, add custom logic, and access tools like ComfyUI in a user-friendly, preconfigured typescript environment. **Dive into the AI Revolution with CushyStudio**. Unleash your creativity, share your projects, and connect with a vibrant community pushing the boundries of generative AI. Experience the fusion of simplicity and innovation. {% hint style="warning" %} CushyStudio is in BETA, under active development, so you will encounter incomplete features or issues due to rapid updates. Your feedback is vital for us to refine and expand the project. Please report any critical problems you find in our discord or open a GitHub issue. {% endhint %} {% embed url="" %} *** * Intro : [Installation](/getting-started/installation) - [First Steps](/getting-started/getting-started) - Navigation * Core : Apps - Drafts - Image Actions - [Prompting](/getting-started/prompting) - Library * Iterate : [Unified canvas](/getting-started/unified-canvas) - [Inpainting](/getting-started/unified-canvas/inpainting) - [Outpainting](/getting-started/unified-canvas/outpainting) - Painting - External Paint Apps - 3d Views - Gaussian Splats - * ComfyUI : Import Workflow - Export Workflow - Programmatic Workflows - Host Management - Parallel execution - Node explorer - Model manager - Plugin manager * Other Integrations : Civitai - Squoosh - PoseMyArt - Minipaint - Unsplash * CushyKit: Live Reload - ... * Innovate : [Creating apps](/going-further/creating-apps) - [App Structure](/going-further/creating-apps/app-structure) - [App UI](/going-further/creating-apps/app-ui) - [CushyKit](/going-further/cushy-sdk) - Tags - Stores - * Supported Technologies : Stable Diffusion (1.5, XL, Turbo, Cascade, SVD) - Samplers - Loras - Embeddings - Upscalers - Preprocessors - Marigold - ControlNet - IP adapter - Regional Prompting - Prompt Cutoff - AnimateDiff - Zero123 - FFmpeg - ImageMagick * [LLM (Large Language Model)](/getting-started/features/llm) : OpenRouter: (ChatGPT: 3.5, 4), Claude * Community: Discord - [Twitter](https://twitter.com/_rvion) - Website - [Documentation](https://docs.cushystudio.com) * Contribute: Github * Questions: FAQs - License - Can Cushy - Roadmap - Changelog {% hint style="warning" %} Cushy documentation is just starting, lots of undocumented features for now {% endhint %} *** Screenshots and Videos: # Installation {% hint style="info" %} This section will assist you with anything to do with setting up and maintaining a CushyStudio installation including all required dependencies. {% endhint %} # Installing Cushy ## Installation Guide Follow the instructions below to set up CushyStudio on your machine. If you encounter any problems please check out our [Troubleshooting](/going-further/wip-pad)steps. ### Windows {% hint style="info" %} {% code overflow="wrap" %} ``` If you encounter any permission issues, try running the script as an administrator by right-clicking on `_windows-install.bat` and selecting "Run as administrator". ``` {% endcode %} {% endhint %} 1. **Download the Repository:** * You can download the CushyStudio repository from [GitHub](https://github.com/rvion/CushyStudio) by either: * Cloning the repository using Git: 
git clone https://github.com/rvion/CushyStudio.git
* Or downloading the latest stable release directly from the [releases page](https://github.com/rvion/CushyStudio/releases). 2. **Run the Install Script:** * After downloading the repository, extract the contents of the downloaded `.zip` file to a directory of your choice. * Navigate to the extracted directory and locate the `_windows-install.bat` script. * Double-click on `_windows-install.bat` to run the installation script. * This script will automatically install Cushy, as well as any required dependencies. 3. Start Cushy: * Start Cushy with the `_windows-start.bat` *** ### Mac and Linux 1. **Download the Repository:** * You can download the CushyStudio repository from [GitHub](https://github.com/rvion/CushyStudio) by either: * Cloning the repository using Git: 
git clone https://github.com/rvion/CushyStudio.git
* Or downloading the latest stable release directly from the [releases page](https://github.com/rvion/CushyStudio/releases). 2. **Run the Install Script:** ```bash cd CushyStudio ./_mac-linux-install.sh ``` * This script will automatically install Cushy, as well as any required dependencies. 3. **Start Cushy** ```bash ./_mac-linux-start.sh ``` # Updating Cushy CushyStudio updates itself effortlessly. To update: 1. **Close CushyStudio:** Ensure CushyStudio is closed before proceeding with the update. 2. **Run the Update Script for Your Platform:** * For Mac and Linux, execute: `_mac-linux-update.sh`. * For Windows, run: `_windows-update.bat`. #### Risks When Updating When updating, consider the following risks: * **Broken Migrations:** On every startup, CushyStudio applies new changes to its database, including all migrations. A backup feature will be implemented soon to ensure you never lose your drafts or prompts. * **App Incompatibility:** CushyKit is designed to be robust to breaking changes. Your custom apps should never lose their drafts. However, after an update, you may need to update your custom apps. Sometimes, a built-in app will also be updated. #### Updating Manually When updating manually (e.g., with a git pull or checking out a branch), follow these steps: * Run the update script to ensure everything is properly updated. * If you're updating manually with a git pull or checking out a branch, you will need to run the install script to install all dependencies correctly. # Scripts Within the CushyStudio directory you will have these scripts to aid you with installation or maintenance, here is a brief overview of their functionality. * \_\[platform]-cleanup: * \_\[platform]-install: * \_\[platform]-reset-db: * \_\[platform]-start-dev: * \_\[platform]-start: * \_\[platform]-update: # Installing Modules Cushy orchestrate various tools like ComfyUI or FFMpeg. Some apps require you to have those tools installed. This section will help you having everything ready. # Install ComfyUI ComfyUI is a toolkit to build Generative AI pipelines and execute them. It is very powerful but have a complex node-graph interface that makes it hard to use. Most CushyStudio Apps build on top of ComfyUI as a backend You can find install instructions here: ## LOCAL (same machine) if you're on windows or linux and if your local machine has a powerful GPU, installing ComfyUI localy is probably a good idea. On windows, there is a portable version that should be fairly easi to ### Install from scratch installing from scrath ### Pre-existing ComfyUI if you already have a working ComfyUI setup, you can just use-it without any more work. * Go to your host section * add custom host * 🚧🎥 image ### Managed ComfyUI There are a few services that offer managed ComfyUI instances. It's not our focus yet, but we may also try to offer managed ComfyUI instances in the future. {% hint style="info" %} contribution welcome ;) {% endhint %} ## LOCAL network You can have .... 🚧
## CLOUD # Install FFMpeg (optional) Some apps that generate or deal with video content make use of FFMpeg. FFMpeg is a a complete, cross-platform solution to record, convert and stream audio and video. it is distributed as a command line tool called `ffmpeg` . Some apps will expect ffmpeg to be available on your system . [Link to the official Download page.](https://ffmpeg.org/download.html) On mac, you can also: ```bash brew install ffmpeg ``` # Installing Models ## Installing Models Working with generative AI require having models available on your runtime host. There are lots of very different models covering different use-cases. Most CushyApp use several models. Some models are used for segmentation, some for shape detections, some are for image generation, image refinements, adding new concepts, upsacaling images, guiding generation from depth map, etc. ## By manually downloading models into your host ComfyUI installation if you follow some online instructions telling you to download a model into your ComfyUI installation subfolder, this will work with cushy whitout any problem. Just make sure to reload your ComfyUI server so it picks up the model, then make sure to reload the schema on CushyStudio side too ## Via the built-in Civitai UI You can install civitai models via the dedicated civitai interface. This interface is focused on finding and downloading models. ![](https://cushy.fra1.cdn.digitaloceanspaces.com/rvion/FqDYlfMgIYxnlKfx80cdhGqgoEKDpz0ZD0pNuHeto0.jpg) ![](https://cushy.fra1.cdn.digitaloceanspaces.com/rvion/jBOukcIgmPCUjVi1zWmeFjDccMgTjdV4iT8tYJuItCg.jpg) * it uses the civitai API to find models / versions / previews / files * it convert downloadable files from Civitai into compatible request with ComfyUI manager. > 👉 the conversion is not perfect yet; feel free to make it more robust there `src/panels/Panel_Models/CivitaiResultVersionUI.tsx` Make sure to reload your ComfyUI server so it picks up the model, then make sure to reload the schema on CushyStudio side too. ## Via the wiget requirements in your apps. Apps can define model via the `requirements` property available on every widget. ![](https://cushy.fra1.cdn.digitaloceanspaces.com/rvion/5v4kQlnbyKvV6taXSliL4DqN15jZXTHPheE3Rpdqw.mp4) ### Built-in list of known models Cushy use the list of Known Models from [ComfyManager](https://github.com/ltdrdata/ComfyUI-Manager). This widget have a built-in list of hundreds of models, such as `TAESD`, `upscale`, `checkpoints`, `insightface`, `deepbump`, `face_restore`, `zero123`, `embeddings`, `VAE`, `unet`, `clip`, `lora`, `unclip`, `T2I-Adapter`, `T2I-Style`, `controlnet`, `clip_vision`, `gligen`, `sam`, `seecoder`, `Ultralytics`, `animatediff`, `motion lora`, `IP-Adapter`, `PFG`, `GFPGAN`, `CodeFormer`, `facexlib`, `photomaker`, `instantid`, `efficient_sam`, `Shape Predictor`, `Face Recognition` The list of models is cached locally, and processed to generate various metadata. ## Via the Civitai custom nodes for ComfyUI. Some Cushy Apps allow to paste a Civitai special code to download and use the model right from your ComfyUI workflow execution. ![](https://cushy.fra1.cdn.digitaloceanspaces.com/rvion/AYacYzeDCztEkFCFkbMRwt3AaFcMXeA212xkZ2Xw.jpg) this approach requires having the civitai custom nodes installed. ## Browse models from the official civitai You can also browser the Civitai official UI directly from Cushy using and embedded iframe; it will allow you to search things differently, or will allow you to copy the ckpt-air. Beware, loading this website is really slow; may make you fan spin. For simple use-cases, use the built-in ![](https://cushy.fra1.cdn.digitaloceanspaces.com/rvion/Vkc8k0riGEbeK6b8bK5iWu7S16piWhebFE9vBMyRXs.jpg) # Install ImageMagick (optional) ImageMagick is a free and open-source software suite for modifying images 🚧 Some apps use ImageMagick to do some image transformation locally without requiring custom nodes. See example # First Steps .... # Intro to Generative AI \##This might end up being it's own top level section if there is too much information. This page or section will contain: * The Timeline of Generative AI, including the technologies that came and went, GAN, Diffusers, Etc * A very brief overview of other frontends, very superficially, we aren't here to bash on other projects. * A general overview of different model architectures along with their pros and cons. * A general overview of LoRAs, Lycoris, LoCON, Hypernetworks and TIs * Key concepts that are required for working with Generateive AI such as Prompting, CLIP Skip, CFG, ideal resolutions, Upscaling, inpainting, outpainting, * Links to resources regarding more in depth articles and papers that describe the technology in depth for people who are interested. * Links to valuable tutorials (Or we make our own.) * Links to models and resources (Civitai/Tensorart?) Maybe... # Making an image Cushy comes packed with [Broken mention](broken://pages/SwJrB377HPj3QcX5FmSa). let's get started by using the #Cushy # Coming From... # Built-in apps Cushy apps cover a wide range of use-cases..... ## ## Library Cushy library ### folders go make your own apps: [Creating apps](/going-further/creating-apps) ## Types of apps ### Contextual Apps Some apps are made to started quickly from an existing image, e.g. [Rotate anything](/getting-started/built-in-apps/rotate-anything), some apps are made to be started on a click in the unified canvas, ... ### Real time apps Some apps are made to be used in real time. they make use of real-time fancy features such as ..... eg. quick draw: e.g. rotate anything {% embed url="" %} ## Project specific apps Some apps are.... * [Slay the Spire - Art Pack](/getting-started/built-in-apps/slay-the-spire-art-pack) : create a * # CushyDiffusion ## Use cases... ... ## Interface ... ## Sample outputs ## # Rotate anything # Cushy Cascade # Remove Background # Slay the Spire - Art Pack This app generate a full custom art pack extension you can use for any character. Just type a promptt, and you get your mod ready to install ! .... # Manga Coloring This app lets you pick any folder with black and white scan, give a few colored references, and with the click of a button, will generate a new folder with all scans colorized. # Cushy Interface In this section, we'll go through every panels, so you know where to find what you need \##This page will provide a list of all the categories for easy navigation for users to find information about the feature or process they are after. # Draft Panel You use CushyApps, by create drafts, and running them. \ An app draft is a set of values ready to be submitted.\ You can have as many drafts per app, and you can organize them by names. are specific prompts and # Welcome Panel Welcome panel is visible when you open the app for the first time, or when you reset your interface. Unfinished panel; will help you get started quickly. {% embed url="" fullWidth="false" %} # Minipaint # File Explorer The `File explorer` panel allows you to browse your library folder Tree follow the pattern: * Folder * Script * app * drafts {% embed url="" %} 1. CushyScript 2. CushyApp declared in script 3. Draft created in the ui for that App # Quick-Civitai # Iframes Cushy allow you to embed any other website you may need though iframe. If those iframe download files, those files will be directly imported # Minipaint # Civitai the Civitai Iframe # Image Comtext menu test
# Images, Videos, 3d scenes # Quick Actions # LLM (Large Language Model) LLM can improve your prompts, comment your artwork, and help you on a wide range of tasks. They can also greatly help automating things that use to require humans. ## Example CushyStudio allow you to build LLMs into your apps. you can take a look at the `library/sdk-examples/example-llm.ts` app that allow you to transform a few words prompt into a fully fledge ![](https://cushy.fra1.cdn.digitaloceanspaces.com/old/screenshots/2023-12-03-llm-example.jpg) ## Current features * built-in prompt-master system prompt to quickly try LLMs * ability to define custom agents / customize every system prompts * open-router based * \=> you have access to all the models chatgpt4, claude 2, various unfiltered llama flavors, etc. ## Planned * ⏳ Local LLMs * ⏳ Other cloud providers like OpenAI # Unified canvas {% hint style="warning" %} unfinished {% endhint %} Cushy Unified canvas allow you to iterate on your images using a new paradigm Abstractions: Layers + Masks + Selections Capabilities: * Arrange multiple images and layers onto each other * define masks * fine * Inpaint: retouch parts of the images with * paint {% embed url="" %} # Starin # Inpainting Inpainting is a method to fix or fill in missing or damaged parts of images, or to remove unwanted objects, creating a complete picture. With AI and the Stable Diffusion model, inpainting can also create entirely new elements in any part of an image, not just fix it.
# Outpainting # Prompting # adding Loras # Creating apps # Creating a new App file this page explains how to create a new app Apps are defined in typescript files in you `./library` folder Creating a new app means adding a new file with an app directive (see [App Structure](/going-further/creating-apps/app-structure)) ## One click app creation You can quickly create an app from ... 🚧 ## You can create apps 🚧 ## Importing a cushy # Prefabs ## Prefabs Prefabs are piece of a model definition you can re-use across your model/apps. CushyStudio comes with a lot of prefabs, and lots of utilities to create new prefabs. ## Example of built-in prefabs `library/built-in/_prefabs/prefab_model.ts` this is a picture of the model prefab available in cushy studio. ![](https://cushy.fra1.cdn.digitaloceanspaces.com/rvion/f496643b645444236c4da8686f424d9a38668e41.jpg) ## Making prefabs for comfy\_ui nodes When you just want to have the exact same fields as you can find in a You can use ## Making your prefabs very fast to typecheck to make your prefabs very fast to typecheck, you can: * export a named type alias for your prefab return type * annotate the return of your prefab function with that type since 2024-06-25, there is now a globally available `X` namespace that allow to quickly add typings to your prefabs without having to import anything ```tsx import type { Builder } from '../../../src/controls/Builder' import type { SchemaDict } from '../../../src/csuite' import type { MediaImageL } from '../../../src/models/MediaImage' import type { OutputFor } from './_prefabs' // add an explicit type // HINT: you don't have to type that manually, vscode can write it for you export type UI_Mask = X.XChoice<{ noMask: X.XGroup mask: X.XGroup<{ image: X.XImage mode: X.XEnum<'LoadImageMask.channel'> invert: X.XBool grow: X.XNumber feather: X.XNumber preview: X.XBool }> }> // and add explit return type to your function // VVVVV export function ui_mask(): UI_Mask { const form: Builder = getCurrentForm() return form.choice({ appearance: 'tab', icon: 'mdiDominoMask', label: 'Mask', default: 'noMask', // box: { base: { hue: 20, chroma: 0.03 } }, items: { noMask: form.group(), mask: form.group({ collapsed: false, label: false, items: { image: form.image({}), ... ``` ## copy automatically your prefab typings in vscode first, install the vscode extension `Young-Vform.copy-hover-type` ![](https://cushy.fra1.cdn.digitaloceanspaces.com/rvion/995dd74a590834c97303b14d07fec6450e2b3cfa.jpg) then, you can copy the type of a variable by hovering over it and pressing the proper keybinding (`ctrl+k ctrl+h` on windows by default) ## Making sure your typescript will always show full types typescript will bail-out and show `...` if the type is too long to be displayed. sadly, the extension mentioned above will not be able to expand those `...` and typescript codebase do not have any option to change that. (some people will mention using `noErrorTruncation`, but it doesn't work for this use-case, since we do not have any error here, just a truncation of the type given by the Language Server) you need to edit the `tsserver.js` file your vscode instance is using ``` /resources/app/extensions/node_modules/typescript/lib/tsserver.js ``` e.g. for mac ```sh # if you use the default vscode tsserver.js code /Applications/Visual\ Studio\ Code.app/Contents/resources/app/extensions/node_modules/typescript/lib/tsserver.js #or if you use the local tsserver.js code ./node_modules/typescript/lib/tsserver.js ``` and update the `defaultMaximumTruncationLength` from `160` to some higher value (e.g. `4000`) ![](https://cushy.fra1.cdn.digitaloceanspaces.com/rvion/e08647c65c92af799acc84d1e7b944f3469ce444.jpg) ## Debug vscode slow autocompletion CushyStudio comes with some advanced typescript tooling to debug inference speed issues, and help to troubleshoot code slowness. ![](https://cushy.fra1.cdn.digitaloceanspaces.com/rvion/991a1e9552932f051abae65015e002e455f352ac.jpg) to start the tool, you just need to: uncomment those two lines in your `.vscode/settings.json` ```json { //... "typescript.tsserver.log": "normal", "typescript.tsserver.enableTracing": true, //... } ``` start the tool with the command ```shell bun src/perfs/monitorVSCodePerfs.ts ``` # App Structure # Contextual Apps CushyApps can be started form both context menu. this page shows how your custom app can support that Contextual apps allow you start any app (workflow) from an existing image ( [Image Comtext menu](/getting-started/cushy-interface/image-comtext-menu)) or selection ([Unified canvas](/getting-started/unified-canvas)) ## Make your app compatible 1. Add canStartFromImage ```typescript app({ ... canStartFromImage: true, }) ``` 2. update your `run` handler to take a third param ```typescript // 👇👇👇👇👇 run: async (run, ui, startImg) => { ``` ## Add new entries to the image context menu once your **CushyApp** is *start-from-image* enabled, you can just create new drafts of your app. Every draft will show as a new menu entry ## Support both beeing run as context action or standalone Supporting both is easy. ```typescript run: async (run, ui, startImg) => { // if startImg is null, it will take ui.startImage instead let img = startImg ?? ui.startImage } ``` ## Built-in examples to look at look at the `library/quick-actions/*` * library/built-in/quick-actions/quick-dispace.ts * library/built-in/quick-actions/quick-refine.ts * ... # For loops CushyApps supports any kind of control flow. This page show how to do so {% hint style="success" %} Key learnings: * [x] You can add for loops in your apps to repeat various set of nodes. * [x] Using `let latent: Comfy.Signal['LATENT'] = ...` is a great way to allow to cary a "Latent" signal {% endhint %} ## Objective Start from the default app, and enhance it to allow for a configurable number of recursive samplers. 1. Add a new number input to control how many ksampler we want 2. Use that number to genearte
Final Code ```typescript app({ metadata: { name: 'demo for-loops', description: 'my app description' }, ui: (form) => ({ model: form.enum['CheckpointLoaderSimple.ckpt_name']({}), positive: form.string({ default: 'masterpiece, tree' }), seed: form.seed({}), // 1. add new UI control to display how many loops you want loops: form.number({ default: 3 }), }), run: async (run, ui) => { const workflow = run.workflow const graph = workflow.builder const ckpt = graph.CheckpointLoaderSimple({ ckpt_name: ui.model }) // 2. here, I'm using the _LATENT annotation to allow to assign any node // that produce a latent, and not just an EmptyLatentImage node. let latent: Comfy.Signal['LATENT'] = graph.EmptyLatentImage({}) // 3. moving embeddigns node definition outside of the Ksampler, // as variable, so they can be used in the loop below const pos = graph.CLIPTextEncode({ clip: ckpt, text: ui.positive }) const neg = graph.CLIPTextEncode({ clip: ckpt, text: '' }) latent = graph.KSampler({ seed: ui.seed, latent_image: latent, model: ckpt, sampler_name: 'ddim', scheduler: 'karras', positive: pos, // use the variables negative: neg, // use the variables }) // 4. add a for loop for (let i = 0; i < ui.loops; i++) { // 👇 I'm reassigning latent variable latent = graph.KSampler({ seed: ui.seed, latent_image: latent, // 👈 from the previous latent model: ckpt, sampler_name: 'ddim', scheduler: 'karras', positive: pos, negative: neg, }) } const image = graph.VAEDecode({ samples: latent, vae: ckpt, }) graph.PreviewImage({ images: image }) await workflow.sendPromptAndWaitUntilDone() }, }) ```
## Diff ```diff app({ model: form.enum['CheckpointLoaderSimple.ckpt_name']({}), positive: form.string({ default: 'masterpiece, tree' }), seed: form.seed({}), + // 1. add new UI control to display how many loops you want + loops: form.number({ default: 3 }), }), run: async (run, ui) => { const workflow = run.workflow const graph = workflow.builder const ckpt = graph.CheckpointLoaderSimple({ ckpt_name: ui.model }) + // 2. here, I'm using the _LATENT annotation to allow to assign any node + // that produce a latent, and not just an EmptyLatentImage node. let latent: Comfy.Signal['LATENT'] = graph.EmptyLatentImage({}) + // 3. moving embeddigns node definition outside of the Ksampler, + // as variable, so they can be used in the loop below + const pos = graph.CLIPTextEncode({ clip: ckpt, text: ui.positive }) + const neg = graph.CLIPTextEncode({ clip: ckpt, text: '' }) latent = graph.KSampler({ seed: ui.seed, latent_image: latent, model: ckpt, sampler_name: 'ddim', scheduler: 'karras', - positive: graph.CLIPTextEncode({ clip: ckpt, text: ui.positive }), - negative: graph.CLIPTextEncode({ clip: ckpt, text: '' }), + positive: pos, // use the variables + negative: neg, // use the variables }) + + // 4. add a for loop + for (let i = 0; i < ui.loops; i++) { + // 👇 I'm reassigning latent variable + latent = graph.KSampler({ + seed: ui.seed, + latent_image: latent, // 👈 from the previous latent + model: ckpt, + sampler_name: 'ddim', + scheduler: 'karras', + positive: pos, + negative: neg, + }) + } + const image = graph.VAEDecode({ samples: latent, vae: ckpt, ``` # App UI ## ## Auto Groups: * use `form.auto.` to add all primitives of a node
# Using ImageMagick in your app This page show how to use ImageMagick in your apps See also: [Install ImageMagick (optional)](/getting-started/installation/installing-modules/install-imagemagick-optional) Tags: mogrify, # CushyKit \##This page will list the features of the Cushy-SDK, links will be provided to the relevant section such as the full API documentation, zero to hero project, cheatsheet, etc. {% hint style="info" %} **Good to know:** depending on the product you're building, it can be useful to explicitly document use cases. Got a product that can be used by a bunch of people in different ways? Maybe consider splitting it out! {% endhint %} ## GitHub Integrations Cras mattis consectetur purus sit amet fermentum. Praesent commodo cursus magna, vel scelerisque nisl consectetur et. {% tabs %} {% tab title="Installing" %} Sed posuere consectetur est at lobortis. Integer posuere erat a ante venenatis dapibus posuere velit aliquet. Aenean lacinia bibendum nulla sed consectetur. Maecenas sed diam eget risus varius blandit sit amet non magna. ``` string | ComponentClass | FunctionComponent ``` {% endtab %} {% tab title="Second tab" %} Maecenas faucibus mollis interdum. Donec id elit non mi porta gravida at eget metus. Donec ullamcorper nulla non metus auctor fringilla. Donec sed odio dui. Donec ullamcorper nulla non metus auctor fringilla. {% endtab %} {% endtabs %} # Importing from ComfyUI # Woking on Cushy # Setting up VSCode 1. Make sure you review recommended extensions (see `.vscode/extensions.json` ) 2. Make sure you have the `prettier` extension properly configured, and that your code properly `format on save` so that your code won't cause diffs when other people later update the same files. # Contributing on the UI ## UI Technologies CushyStudio UI is done with [React](https://react.dev/), [Mobx](https://mobx.js.org/README.html), [DaisyUI](https://daisyui.com/), [Tailwind](https://tailwindcss.com/) and a lot of custom-made components. Code is pretty clean and fairly standard, but understanding Mobx is required, since the whole application is relying on mobx a lot. ## Hot reloading components During dev, you must start CushyStudio with the `_windows-start-dev.bat` or the `_mac-linux-start-dev.sh` so Cushy Studio can hot reload your changes. Components you change in the codebase will be instancly updated in your UI. ## Tailwind autocompletion If you're unfamiliar with tailwind, make sure you have the`"bradlc.vscode-tailwindcss` vscode extension installed so you have autocompletion for both tailwind classes, and daisyui classes.
## The specila \`tw\` property most styling can be done though the magical `tw` property that is injected in all components and helps writing conditional classes, or tailwind classes more easilly. (check the `src/csuite/custom-jsx/jsx-runtime.js` module to look at the implementation) more generally, please take a look at [Setting up VSCode](/going-further/contribution/setting-up-vscode)to ensure you have everything properly hooked up # Contributing on top-level scripts Start / update scripts are the first contact users have with the application, but are also one on the most brittle things. Cushy aims to be able to self-install, and not require anything prior => so it's practical to use native shell scripts to bootstrap a working environment.. ## Working on Windows Scripts If possible, try to follow the style guide defined here: {% embed url="" %} ## Working on MacOS scripts For now, linux scripts are the same as linux scripts ## Working on Linux Scripts For now, linux scripts are the same as macos scripts # Database Cushy use a SQLite Database. As of 2024-02-18, the schema is as follow: # Migrations CushyStudio use a SQLIte database. You can look at the # Troubleshooting How do I fix my broken install ? * some of the config is stored on the DB. you can wipe the DB safely * manually by deleting the `./src/db/cushy-1.db` file * using the debug menu to do the same * you can try those scripts: * \_windows-cleanup.bat * it will: deleting node\_modules folder... * deleting the local node install in the `.cushy` folder * \_windows-reset-db.bat * some of the config is stored on the CONFIG.json at the root * you can delete the config but you'll lose * notably the current layout. so if your current layout has a broken tab that crashes cushy, this tab will be reloaded every time; you may want to remove the part about the layout
# Page 1 # Community \##This page will contain an updated link to the Cushy discord. A link to the main Cushy website, Github, along with any donation platforms (Patreon/Ko-fi/etc) We will place a disclaimer to remind people to check the FAQ before asking in the discord. blah blah blah [Discord](https://discord.gg/BaenNsG2zD) # FAQs {% hint style="info" %} Before asking questions on Discord, we kindly request that you take a moment to review our FAQ for helpful answers. If your answer is not below we would be happy to help. {% endhint %} **Will CushyStudio remain open source and free?** Absolutely! CushyStudio is committed to remaining 100% open source and free to use as a creative tool. Whether you're crafting assets, art, games, or any other creative work, CushyStudio is here to support your vision. **Why the AGPL and not the GPLV3?** For now, CushyStudio is licensed under AGPL (Affero General Public License) as part of a long-term strategy aimed at ensuring the project's sustainability. There are plans to transition to GPLV3 (GNU General Public License Version 3) in the future, once the project has established a stable foundation. This choice is made to safeguard the project and its dedicated community, with a primary focus on preventing unauthorized resale or commercialization of CushyStudio as a service. **Any plans for a paid version of CushyStudio?** No, there are no plans for a paid version of CushyStudio. It will always remain free and open source. While there may be plans to offer complementary services, such as cloud GPU services, the core functionality of CushyStudio will remain freely accessible to all users. The aim is to ensure that CushyStudio is not used for unauthorized resale or commercialization as a service. # Can Cushy... \##Place to showcase the powerful use cases of cushy and demonstrating what it can really do. When people ask us if it can solve a specific problem. # News # Changelog ## 2024-07-29: Panel Icons ## 2024-07-28 SO MANY STUFF, SEE the 2000+ new COMITS. ## 2024-02-28: #### Docs * new Changelog page (`docs/community/news/changelog.md`) * new install page (`docs/getting-started/installation/README.md`) * new installing models (`docs/getting-started/installation/installing-modules/installing-models.md`) #### SDK * New api for optional fields: `form.intOpt(...)` => `form.int(...).optional()` #### UI: * New menu entry to re-open welcome panel if you closed it. #### APPS & Prefabs: * prefab\_model > civitai\_ckpt\_air: add civitai custom node as requirement * new sdk example for booleans (`library/sdk-examples/ui-booleans.ts`) ## 2024-02-27 ([PR](https://github.com/rvion/CushyStudio/pull/178)) #### Misc. Changes * Moves logic to \ so that it's easily re-usable as a checkbox for other widgets * Adds a deprecation warning for label2 on Field\_BoolUI, it should be replaced with the new text option * Dragging to make checkbox share a similar state when you drag over them should work with more areas now that more things will use the same underlying widget instead of duplicated code. (Only WidgetBoolUI, Field\_ToggleUI, and SelectUI (search enum, choices) with this PR) #### InputBoolUI * `expand` Makes the widget use as much space as possible (horizontally) * `icon` Uses a material-symbols-outlined icon name (Not sure how to type this correctly so it's just a string, but displaying all the icon names would be cool) * `display` Sets the way the widget is displayed * * `check` gives you a normal checkbox, with the text/icon to the right * * `button` gives you a toggle-able button similar to how form.choices() looks. * Thing to note is that the display function changes how the undefined state of expand is interpreted, with 'check' using an expand = true by default, and 'button' using an expand = false by default. #### WidgetChoicesUI * Use InputBoolUI #### SelectUI * Use InputBoolUI * Clicking on any non-button part of the pop-up no longer closes it. * Un-focuses the underlying text input when the menu closes. *Fixes the pop-up opening when you un-focus and re-focus the window when the pop-up is active, also just feels nicer. Probably really only hurt the experience for people who use focus window under mouse, like me. uvu* * Closes the pop-up when you are a certain distance away from one of the edges. *Gives people a bit of slack with moving their mouse to/in the pop-up* * You can now drag to set multiple entries to the same state instead of having to click each one individually. * Fake the gaps between entries. *Follows Fitt's law by having no dead areas between the part of the buttons the user can click.* #### WidgetWithLabelUI * Make the header collapse/expand panels, buttons should preventDefault/stopPropagation in onMouseDown to prevent themselves from triggering this if they're in the header. * Holding left mouse and dragging over the headers of panels now quickly expands/collapses them. ## 2024-02-26 ([PR](https://github.com/rvion/CushyStudio/pull/177)) * Prevent new-line when pressing ctrl+enter when used in prompt #177 # Roadmap Current iteration: * more stuff for prompt ( including permutations @Vinsi™#8172 ) * ability to "commit" / "fork" / "export" drafts and see changes since last commit * unified canvas with inpainting/ outpainting / etc. * better forms everywherer * documentation website # Blog # 2024-02-18 - creating the website This website took so much iterations... story time. # Other Softwares # Coming from Krita # Coming from A1111 # Coming from ComfyUI CushyStudio offers a modern, cross-platform user interface designed to enhance your experience with generative AI, used in conjunction with ComfyUI. It streamlines ComfyUI's complex node-based workflow, transforming your workflow into user-friendly "apps" featuring menus, sliders, and dialogue boxes. This design shift enables users to focus more on their creative projects and less on the intricacies of navigating through node graphs to access necessary information. # Coming from InvokeAI {% hint style="info" %} * same feature set * you'll feel right at home {% endhint %} # Coming from Fooocus # Contributing # Supporting the team buy me a # Writing Docs The following is a set of style guidelines we would like all contributors to adhere to. *** For simplicity's sake we try our best to adhere to [Google's ](https://developers.google.com/style)developer documentation style guidelines. They are merely guidelines and not strict rules. Feel free to break free from the guidelines when it makes sense. (Even Google suggests this themselves.) Below we have included any important notes in regards to creating our documentation. You are welcome to ask for advice in our [Discord](https://discord.gg/BaenNsG2zD) if you are unclear about anything. ## Images: {% hint style="success" %} * Images must use unique file names, or they will break conflicting images upon upload. *(This is a quirk with gitbooks.)* * {% endhint %} {% hint style="warning" %} * Use image compression if possible to reduce the filesize of images, {% endhint %} {% hint style="danger" %} {% endhint %} *** ## Text Formatting: {% hint style="success" %} \* {% endhint %} {% hint style="danger" %} \* {% endhint %} ### Base style guide We loosely follow the Google Developer documentation styling guidelines, 🚧 copy paste the key bullet points 🚧 add link to their guide ### Enhance pages with LLM. * if possible, use this prompt: 🚧 ``` .... keep it as concise as possible.... be explicit... ``` ## Page description guidelines: * gitbook allow to enter a short pure-text (no bold, ...) page description on each page. * If possible, add one, but keep it very short. * be descriptive about what this page is about. ## Naming: prefer one word * ❌ Cushy SDK, Cushy Apps, Cushy Studio * 🟢 CushySDK, CushyApps, CushyStudio ## Page intros * every page should start with a few oneliners paragraphs about * one sentence to define stuff * one sentence per other page that is closely related * great way to block things ## Nesting * level0 top level group index-pages * should never have unique content. only summary. * Should have one link to every sub page + at most one or two paragraph (possibly 0) * level1 page should have one single main topic * if a feature have 3 main subfeatures, we add 4 pages. all at the same level, because users will look for any of the 3 main subfeatures as much as the main feature. that also help * 2 options * Only the main feature have the big documentaion, and other pages have one paragrah, one picture, and then point to main page # CushyStudio Features CushyStudio is packed with features, this page list the major ones ## First-class ComfyUI support {% hint style="danger" %} Insert Image of ComfyUI nodes being displayed within Cushy Here {% endhint %} ComfyUI support includes working with Local, Managed, Remote, and Cloud ComfyUI instances. This allows for quick switching between various ComfyUI setups and parallelizing work across multiple instances. Parallelizing load across multiple ComfyUI instances is made easy with features such as automatically downloading images into your local outputs folder, automatic uploading of missing files, and a powerful image hashing system to avoid duplicate uploads. CushyStudio also offers native support for ComfyUI workflows in JSON format and images. Simply add them to the action folder to use them seamlessly within CushyStudio, with the option to convert them into actions in a single click. ## Full Large Language Model (LLM) support {% hint style="danger" %} Insert Image of LLM being used, along with a list of available models able to be pulled from. {% endhint %} Full LLM support includes a built-in prompt-master system prompt for quick experimentation with LLMs. You have the ability to define custom agents and customize all system prompts. The system is open-router based, giving you access to all models, including chatgpt4, claude 2, various unfiltered llama flavors, and more. ## Live painting support {% hint style="danger" %} Insert a video demonstration of Live painting here {% endhint %} Experience the power of real-time creativity with CushyStudio's "Real-time Painting" feature. Harness the artistry of generative AI as you paint and watch your imagination come to life instantly. With our intuitive tools, you can effortlessly craft stunning images that evolve with every brushstroke. Whether you're a seasoned artist or new to generative art, our real-time painting feature empowers you to explore, experiment, and create captivating visuals in the blink of an eye. ## CivitAI integration {% hint style="danger" %} Insert image of the CivitAI browser within Cushy here. {% endhint %} Explore the convenience of our embedded CivitAI browser, which simplifies the discovery and usage of model references and allows for easy download and integration. Additionally, CushyStudio offers custom ComfyUI nodes for CivitAI, ensuring optimal support for a seamless interactive experience. We also provide dedicated Civitai widgets, allowing your applications to effortlessly select CivitAI models, and integrate them into your creative projects and allowing users to use your exact workflow without having to manually fetch the required assets. ## Built-in fully featured image editor (MiniPaint) {% hint style="danger" %} Insert a screenshot of Minipaint's UI within Cushy. {% endhint %} CushyStudio has Minipaint built right in. This offers a comprehensive suite of essential tools to modify and touch up your images while never leaving Cushy. With features like layers, effects, masks, blending modes, and more, you have everything you need to fine-tune and transform your images effortlessly. This allows for quick edits and touchups in any workflow. Allowing you the freedom to focus more on your work and spend less time jumping between applications. ## Create your own Apps {% hint style="danger" %} Insert a screenshot of sample app code here. {% endhint %} CushyStudio simplifies the image and video production process by providing a user-friendly environment. You have the flexibility to create custom prompts in TypeScript, allowing you to take control of your creative workflow. With a strong emphasis on type safety for all values and enums, you can work with confidence. Our integrated standard library expedites the development of your ideal workflow, while the implementation of lambdas offers precise guidance ensuring your nodes generate the necessary values. The production process is incredibly efficient and straightforward, empowering your creative work with ease. # TEMPORARY # Manual ## CushyStudio: ***c*** **CushyStudio is the cross-platform tool that makes interacting with generative AI easy and fun for artists and creatives. It provides all the tools required to work with Generative AI in a unified and extensible environment, be it Image**, **Video**, or **3d. CushyStudio empowers professional and amateurs alike, no matter their skill level.** ### Artistry Made Accessible Cushy makes your idea alive, and easy to use though Simle user interfaces that simplify the magic of generative art for everyone. Discover the perfect app to suit your creative needs within the expansive Cushy Library. Whether you're seeking versatile, general-purpose Apps or highly specialized ones tailored to specific creative purposes, you'll find them here. Once you've crafted your masterpiece, share it with the world by adding it to the Cushy App Library. ### CushySDK: Empowering Your Creativity Unleash your creativity even further with the CushySDK, your ultimate toolkit for automating tasks and addressing specific use cases. Build your very own generative art applications that align with your vision and requirements. CushyStudio equips you with a range of power-user tools and resources, helping you bring your ideas to life. It builds on ComfyUI and streamlines its complex node-based workflow, transforming your workflow into user-friendly "apps" featuring menus, sliders, and dialogue boxes. This design shift enables users to focus more on their creative projects and less on the intricacies of navigating through node graphs to access necessary information. ### Made for the future Join us on this journey into the future of generative art, where creativity knows no bounds. Whether you're an artist, developer, or enthusiast, Cushy Studio invites you to explore, create, and share the incredible world of Generative AI Art. # GPT alt A ## CushyStudio: Simplifying Generative AI CushyStudio is a versatile, cross-platform tool designed to simplify the use of generative AI for creatives and artists of all skill levels. It offers a comprehensive, adaptable environment for creating with generative AI across various mediums such as images, videos, and 3D models. The platform is built to serve both professionals and hobbyists, democratizing artistry by making it accessible to everyone. **Core Features:** * **Cushy Apps:** At the core of CushyStudio are Cushy Apps—self-contained applications tailored to specific creative tasks. These apps boast user-friendly interfaces that demystify generative art, making it approachable for all users. The Cushy Library houses a wide range of apps, from versatile, general-use applications to niche tools designed for specific artistic endeavors. Users can also contribute their creations to the Cushy App Library, fostering a community of shared resources. * **CushySDK:** For those looking to delve deeper, the CushySDK provides an extensive toolkit for custom application development and task automation. This allows for the creation of personalized generative art applications that cater to unique creative visions, offering advanced tools and resources to realize those ideas fully. * **User-Friendly Design:** CushyStudio enhances user experience by building on the ComfyUI framework, simplifying its complex node-based system into intuitive, app-like interfaces with menus, sliders, and dialogue boxes. This shift focuses on reducing the time spent navigating complex workflows, allowing more time for creative exploration. **Join the Generative Art Revolution:** CushyStudio invites artists, developers, and enthusiasts to explore the boundless possibilities of generative AI art. Our platform is committed to pushing the boundaries of creativity, offering a space where anyone can discover, create, and share their work in the evolving landscape of generative art. Dive into CushyStudio—where creativity meets simplicity in the world of generative AI. # GPT alt B ## CushyStudio: Streamlining Generative AI for All CushyStudio delivers a user-friendly, cross-platform experience for engaging with generative AI, catering to artists and creators at every level. This inclusive platform integrates tools for image, video, and 3D model creation within a cohesive and scalable environment, aiming to empower users from hobbyists to professionals. **Key Features:** * **CushyApps:** The essence of CushyStudio lies in CushyApps—dedicated applications designed for specific creative processes. These apps simplify the complexity of generative art, making it accessible and manageable for all. Within the expansive CushyLibrary, users can find an array of apps ranging from versatile, all-purpose tools to specialized solutions for distinct artistic tasks. Additionally, the platform encourages users to share their masterpieces, contributing to a communal library and enriching the community's creative resources. * **CushySDK:** For users interested in deeper customization and automation, CushySDK offers a comprehensive suite for developing bespoke generative art applications. This toolkit enables the creation of applications tailored to individual creative needs, providing advanced tools and resources to bring unique visions to life. * **Intuitive Interface:** Leveraging the foundational strengths of ComfyUI, CushyStudio replaces complex node-based systems with straightforward, app-like interfaces. This redesign prioritizes efficiency, reducing the learning curve and time spent on technical navigation, thus allowing more focus on creative output. **Embark on a Creative Journey:** CushyStudio extends an invitation to artists, developers, and generative art enthusiasts to explore and contribute to the future of generative AI art. By offering a platform where innovation meets ease, CushyStudio is at the forefront of democratizing creative expression through generative AI. Experience the blend of creativity and simplicity with CushyStudio, your gateway to the expansive possibilities of generative AI art. # GPT alt C ## CushyStudio: Streamlining Generative AI CushyStudio offers a streamlined, cross-platform solution that simplifies generative AI for users of all skill levels. It supports a wide array of creative endeavors, from images and videos to 3D models, catering to both professionals and hobbyists. The platform makes advanced creative tools accessible to a broad audience. **Key Features:** * **Cushy Apps:** Central to CushyStudio, these dedicated applications cater to specific creative tasks with intuitive interfaces, making generative art accessible to everyone. The diverse Cushy Library includes both versatile and specialized apps, encouraging users to share their creations and enhance the collective resource pool. * **CushySDK:** The CushySDK extends functionality, offering tools for custom application development and task automation. This toolkit empowers users to craft bespoke generative art applications, aligning with individual creative goals and leveraging advanced resources to bring visions to life. * **Simplified Workflow:** CushyStudio refines the ComfyUI experience, transitioning from a complex node-based system to an accessible, app-like interface. This approach minimizes workflow complexities, freeing up more time for creative pursuits. **Engage with Generative Art:** CushyStudio is a call to creatives, developers, and art enthusiasts to explore the potential of generative AI art. It's a platform where innovation meets ease, offering tools for discovery, creation, and sharing within the generative art community. Explore CushyStudio—your gateway to accessible and advanced generative AI creativity.