DevShots

Developer Tool to Create Code Share Image

Products

You can use this tool at devshots.app.

App is planing.

Feature

You can use DevShots to make Code Image, ScreenCapture Image, even iPhone Mockup

Now we have these features:

• X.com(Twitter), Threads, Facebook, Instagram, Pinterest, Reddit, LinkedIn, TikTok Media templates. with Square, Landscape, Portrait Style.
• Lots of code themes, Chinese themes, iPhone themes.
• Lots of good design background.
• Text and Image Mode Choices.
• 5 Font Size and 5 Padding Size to adjust content faster.
• Support Mac, Windows, iPhone Mockup effect.
• Support media watermark, with your username and userid.

Update history

Version 24.3.7

• 📰 Add KingHwa Old Song Font
• 📰 Add Old Newspaper Theme
• 🀀 Add Chiense Peom Theme and 2 Chinese Fonts
• 🗂 Optimize Favorites Function
• 🚗 Fix Word Wrap Style
• 🔟 Ten Code Font
• ⌚️ Apple Watch,iPad Mockup
• 📱 iPhone Mockup
• 🗂 Favorites Function
• 🇯🇵 2 Japanese Font
• 🔠 Upto 10 Font Family
• 🆕 New DevShots.app Domain 🎂
• 🎨 Text Color Adjust 🎂
• 🇰🇷 Support Korean 🇨🇳🇬🇧🇯🇵🇰🇷
• 🇯🇵 Support Japanese 🇨🇳🇬🇧🇯🇵
• 🔠 Modify Font Face 👧🎂
• ✅ DevShots Media Responsive
• 🔠 Modify Font Face 👧🎂
• ✅ DevShots Media Responsive
• 📱 Add iPhone15 Mockup
• 🌃 Image x Text Mode
• 🎲 Fun Shuffle Theme
• 📝 Support Markdown Format
• 🔍 Upscale Download Image
• 🀄️ Add 4 Chinese Font Theme

Some Works

Twitter Site Preview Image

自媒体分享图

User Feedback

waiting for your advice.

Roadmap

We want to help Developers to make all kinds share images quickly.

Github Project

https://github.com/orgs/70Apps/projects/1/views/1

Issues

• AppStore images
• More Chinese Fonts
• More Code themes
• Post image to Social Media Shortcuts

One more thing

Welcome add issues and discuss with us.Try it now on devshots.app.

Resource Thanks List

Fonts

• 🇬🇧 Consolas : https://learn.microsoft.com/en-us/typography/font-list/consolas
• 🇬🇧 Inconsolata : https://github.com/googlefonts/Inconsolata
• 🇬🇧 JetBrains Mono : https://github.com/JetBrains/JetBrainsMono
• 🇬🇧 Source Code Pro : https://github.com/adobe-fonts/source-code-pro
• 🇺🇸 Cascadia Code : https://github.com/microsoft/cascadia-code
• 🇬🇧 SF Mono : https://github.com/supercomputra/SF-Mono-Font
• 🇨🇳 更纱黑体：SARASA GOTHIC : https://github.com/be5invis/Sarasa-Gothic
• 🇨🇳 霞鹜文楷：LXGW WenKai : https://github.com/lxgw/LxgwWenKai
• 🇨🇳 演示佛系体：Slidefu : https://github.com/maoken-fonts/slidefont
• 🇨🇳 江西拙楷 : https://www.zcool.com.cn/work/ZNDE4MzY4Mjg=.html
• 🇯🇵 Makinas 4 Square : https://moji-waku.com/makinas/index.html
• 🇯🇵 M Plus 2 : https://mplusfonts.github.io/
• 🇨🇳 小赖字体 : https://github.com/lxgw/kose-font
• 🇨🇳 萌神手写体 : https://github.com/MaruTama/Mengshen-pinyin-font
• 🇨🇳 京华老宋体 : https://zhuanlan.zhihu.com/p/637491623

Mockup

• Free Mockups - 390 Mockup ：https://www.figma.com/community/file/1299381971305083003
• Apple Device Mockups : https://www.figma.com/community/file/1125798347304294441
• Apple Device Mockups (iMac, MacBook, iPhone, iPad and Apple Watch) (Community) : https://www.figma.com/file/DftksHqVe8ZjwjPXWmSDzH/

Develop Resource

• 中文 Web Font 切割工具 : https://github.com/KonghaYao/cn-font-split
• react-i18next : https://react.i18next.com/
• https://github.com/image-js/image-js

Github Stuff

• Add PR niklasvh/html2canvas#3153 to html2canvas project to fix transfrom rotate style issue
• 新增免费商用字体【演示佛系体】 KonghaYao/chinese-free-web-font-storage#10