Simple Snap API | Documentation - snappify
Learn how to automate the creation of beautiful code screenshots
Our powerful editor gives you the ability to create beautiful code snippets with ease. But sometimes you might want to create them programmatically. That’s why we’re building an API around the functionalities of snappify so you’re able to automate the process.
We started out with this “Simple Snap” API, where you can pass the code + style settings to our REST endpoint and receive the generated image. Our users leverage this API to e.g. create Twitter Posts automatically or generate beautiful OG Images in their services.
Hint 💡
The API is only available to users on our paid plans and if you want to remove the watermark, you have to upgrade at least to the Pro plan. Check our pricing table for more infos.
Usage
The API is available at https://api.snappify.com/snap/simple as a POST call.
You have to send your API-Key in the Authorization Header.
The configuration has to be sent as a JSON body. Here you can see an example config:
Config Parameters
code
* required
Description
Pass your code as a string. Line breaks should be passed as \n.
language
Description
The programming language which should be used for syntax highlighting.
Type
"abap" | "actionscript" | "angular html" | "angular typescript" | "apache" | "apl" | "applescript" | "assembly (x86 & x64)" | "assembly (arm)" | "astro" | "autoit" | "bash" | "c" | "c++" | "c#" | "clojure" | "cobol" | "css" | "cypher" | "dart" | "docker" | "elixir" | "elm" | "erb" | "erlang" | "fish" | "f#" | "gdscript" | "gdshader" | "gherkin" | "graphql" | "go" | "groovy" | "haskell" | "hcl (terraform)" | "html" | "ini" | "java" | "javascript" | "julia" | "jupyter" | "jsx" | "json" | "kotlin" | "latex" | "less" | "liquid" | "lisp" | "llvm" | "lua" | "markdown" | "matlab / octave" | "mdx" | "mlir" | "nginx" | "objective c" | "objective c++" | "ocaml" | "pascal" | "perl" | "php" | "plain text" | "pl/sql" | "powershell" | "prisma" | "python" | "qml" | "r" | "ruby" | "rust" | "sass" | "scala" | "shell" | "smalltalk" | "solidity" | "sparql" | "sql" | "stylus" | "svelte" | "swift" | "toml" | "typescript" | "tsx" | "visual basic" | "vue" | "wasm" | "wolfram" | "xml" | "yaml" | "zsh"
theme
Description
The theme which should be used for syntax highlighting.
Type
"bt-vivid-black" | "catppuccin-frappe" | "catppuccin-macchiato" | "catppuccin-mocha" | "cobalt2" | "dark-plus" | "darcula" | "dracula-soft" | "dracula" | "flexoki-dark" | "github-dark" | "github-dark-colorblind" | "github-dark-dimmed" | "jetbrains-dark" | "lucario" | "lucario-custom" | "lucy" | "lucy-evening" | "oh-lucy" | "material-darker" | "material-default" | "material-deep-ocean" | "material-ocean" | "material-palenight" | "mayukai-sunset" | "min-dark" | "monokai" | "nightowl" | "nord" | "one-dark" | "one-dark-pro" | "panda-syntax" | "poimandres" | "rouge" | "shades-of-purple" | "shades-of-purple-sd" | "slack-dark" | "solarized-dark" | "sublime-oceanic" | "vitesse-dark" | "flexoki-light" | "github-light" | "github-light-colorblind" | "catppuccin-latte" | "light-plus" | "material-lighter" | "min-light" | "nightowl-light" | "slack-ochin" | "solarized-light" | "vitesse-light"
Default
"github-dark-dimmed"
background
Description
The desired background color as CSS value. (Also supports transparent)
Default
"linear-gradient(337deg, #654ea3, #da98b4)"
codeBackground
Description
The desired background color for the code snippet window. If nothing is passed, the default background color of
the chosen theme will be used.
hideBoxShadow
Description
Enables you to hide the box-shadow of the code window.
profileInfo
Description
Configuration for including your own profile info into the snap. If not specified, no profile info will be shown. You can configure your profile info on the dashboard.
position
Type
"bottom-left" | "bottom-center" | "bottom-right"
fileName
Description
The filename which should be shown in the tab of the code snippet window. Leave empty for no tab at all.
hideTab
Description
If specified, the whole tab-header of the code snippet window will be hidden.
showLineNumbers
Description
Enables line numbering in the code snippet.
firstLineNumber
Description
Specifies the first line number to count from.
fontSize
Description
You can specify the font size of your code snippet. Can be a value from 8 to 30.
fontLigatures
Description
Toggles the visibility of font ligatures in your code.
showWatermark
Description
Toggles the visibility of the snappify watermark.
If you’re on the personal plan, the watermark will always be shown.
aspectRatio
Description
Can be passed if the resulting image should keep a specific Aspect Ratio.
width
Description
Width of the Aspect Ratio (e.g. 16).
height
Description
Height of the Aspect Ratio (e.g. 9).
highlights
Description
Let’s you specify various highlights for each line in your code snippet.
1
Description
Highlight Options for the first line. (You can specify highlight options per line)
opacity
Description
The opacity of the line. Must be between 0 and 1.
diff
Description
Let’s you visualize added or removed lines, like in a git diff.
filter
Description
Let’s you apply a blur or grayscale filter to the line.
Type
"blur" | "grayscale"