< p align = "center" > < img width = 100% src = "https://user-images.githubusercontent.com/10369094/31211729-591d059c-a950-11e7-86af-fa5ea3d7dbac.png" > < / p >
<!-- [![Dependencies](https://img.shields.io/david/dawnlabs/carbon.svg)](https://github.com/dawnlabs/carbon/blob/readme - badges/package.json) -->
[![All Contributors ](https://img.shields.io/badge/all_contributors-53-orange.svg?style=flat-square )](#contributors)
[![styled with prettier ](https://img.shields.io/badge/styled_with-prettier-ff69b4.svg )](https://github.com/prettier/prettier)
[![PRs Welcome ](https://img.shields.io/badge/PRs-welcome-brightgreen.svg )](http://makeapullrequest.com)
[![MIT License ](https://img.shields.io/github/license/dawnlabs/carbon.svg )](https://github.com/dawnlabs/carbon/blob/master/LICENSE)
[![Greenkeeper badge ](https://badges.greenkeeper.io/dawnlabs/carbon.svg )](https://greenkeeper.io/)
[![Join the community on Spectrum ](https://withspectrum.github.io/badge/badge.svg )](https://spectrum.chat/carbon-now)
< br > < / br >
[![Deploy to now ](https://deploy.now.sh/static/button.svg )](https://deploy.now.sh/?repo=https://github.com/dawnlabs/carbon& env=TWITTER_CONSUMER_KEY& env=TWITTER_CONSUMER_SECRET& env=TWITTER_ACCESS_TOKEN_KEY& env=TWITTER_ACCESS_TOKEN_SECRET& env=LOGS_SECRET_PREFIX)
## Introduction
Twitter で[いつも](https://twitter.com/dan_abramov/status/890191815567175680)[見るような](https://twitter.com/reactjs/status/890511993261654017)[こうしたコード](https://twitter.com/notquiteleo/status/873483329345028096)の[スクリーンショット](https://twitter.com/zeithq/status/805779711154647040)をご存知ですか? こうしたコードはたいていは印象的ですが、美しさの点では改善の余地があります。Carbon を使えば、ソースコードの美しいスクリーンショットを簡単に作成し、共有することができます。今すぐ、この新しいデザインの力を使ってフォロワーを感動させましょう。
プロジェクトの詳細は[carbon.now.sh](https://carbon.now.sh)や[投稿](https://dawnlabs.io/case-studies/carbon/)にあります。
## Features
- **GitHub gist からのインポート**. URL に GitHub gist id を付け加える
- **カスタマイズ**. シンタックステーマやウィンドウスタイルなどをカスタマイズ
- **すばやくシェア**. ワンクリックで画像を保存したり、リンクをツイート
## Example
< p align = "center" > < img width = 100% src = "https://user-images.githubusercontent.com/10369094/30791512-cb001438-a167-11e7-952b-f0f0e5c4499e.png" > < / p >
## Usage
#### Import
Carbon にインポートするには何通りかの方法があります:
- エディターにファイルをドロップする
- URL に GitHub gist id を付け加える (e.g. `carbon.now.sh/GIST_ID_HERE` )
- コードを直接ペーストする
#### Customization
コードを Carbon にインポートできたらシンタックステーマや背景色、ウィンドウスタイル、パディングなどで、画像をカスタマイズすることができます。
#### Export/Sharing
画像のカスタマイズが終わったら、画像リンクをツイートしたり直接ダウンロードできます。
' Tweet' ボタンを使えば、Carbon は自動的に画像を利用できるようにします。もし Carbon の画像を手動でツイートしたい場合は、[画像のアクセシビリティを向上させる方法](https://help.twitter.com/en/using-twitter/picture-descriptions)を確認してください。
投稿の中で Carbon 画像を使うと、ソースコードは assistive technology からは見えなくなり、拡大やコピーなどはできなくなります。画像の下に[HTML Details Element](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/details)のように、テキストとしてソースコードを持つ別の要素を追加することを検討してください。
## Community
私たちの素晴らしいコミュニティが作成したプロジェクトをチェックしてください:
##### Editor Plugins
- [IntelliJ IDEA `carbon-now-sh` ](https://plugins.jetbrains.com/plugin/10469-carbon-now-sh ) - 現在の IntelliJ IDEA ファイルの選択したコードをコンテキストメニューから Carbon で開く
- [Atom `carbon-now-sh` ](https://atom.io/packages/carbon-now-sh ) - `shift-cmd-A` コマンドを使い、現在の Atom ファイルを Carbon で開く
- [VS Code `carbon-now-sh` ](https://marketplace.visualstudio.com/items?itemName=ericadamski.carbon-now-sh ) - `carbon` コマンドを使い、VS Code ファイルを Carbon で開く
- [Sublime Text 3 `carbon-now-sh` ](https://github.com/molnarmark/carbonSublime ) - カスタムコマンドを使い、現在の Sublime Text 3 ファイルの選択したコードを Carbon で開く
- [Vim `carbon-now-sh` ](https://github.com/kristijanhusak/vim-carbon-now-sh ) - `CarbonNowSh()` 関数を使い、現在の Vim/Neovim を Carbon で開く
- [Emacs `carbon-now-sh` ](https://github.com/veelenga/carbon-now-sh.el ) - `carbon-now-sh` インタラクティブ関数を使い、現在の Emacs を Carbon で開く
- [Xcode `carbon-now-sh` ](https://github.com/StevenMagdy/CarboNow4Xcode ) - `carbon.now.sh` を使い、選択したコードを Carbon で開く
##### Tools
- [CLI `carbon-now-cli` ](https://github.com/mixn/carbon-now-cli ) - `carbon-now` を使い、Carbon でファイルを開いたり、直接ダウンロードする。インタラクティブモードや、シンタックスハイライト機能など
- [Carbonize ](https://itunes.apple.com/us/app/carbonize/id1451177988 ) - 拡張ネイティブ機能を備えた macOS ラッパー
- [CodeExpander ](https://codeexpander.com ) - TextExpander 機能を備えたスマートな GitHub Gist クライアント
##### Libraries
- [R `carbonate` ](https://yonicd.github.io/carbonate/ ) - `R` でインタラクティブに画像のスタイルを操作し、コードを Carbon で開くか直接ダウンロードする
##### Textbooks
- ["CS 101 - An Introduction to Computational Thinking" ](https://itunes.apple.com/us/book/id1435714196 ) - Sarbo Roy によるコンピューターサイエンスのテキストブック
## Contribute
PR を歓迎しています。詳細は[CONTRIBUTING.md](https://github.com/dawnlabs/carbon/blob/master/.github/CONTRIBUTING.md)をご覧ください。
## Thanks To
[ ▲ ZEIT ](https://zeit.co/ )は Carbon のホスティングを支援してくれています。
## Authors
Carbon は< a href = "http://dawnlabs.io/" > < img width = 8% src = "https://cloud.githubusercontent.com/assets/10369094/25406306/dacebd4c-29cb-11e7-8e1c-468687cde495.png" > < / a > によるプロジェクトです
- Mike Fix ([@mfix22](https://github.com/mfix22))
- Brian Dennis ([@briandennis](https://github.com/briandennis))
- Jake Dexheimer ([@jakedex](https://github.com/jakedex))
## Contributors
これらのすべての素晴らしい人々に感謝を ([emoji key](https://github.com/kentcdodds/all-contributors#emoji-key)):
<!-- ALL - CONTRIBUTORS - LIST:START - Do not remove or modify this section -->
<!-- prettier - ignore -->
< table > < tr > < td align = "center" > < a href = "https://github.com/briandennis" > < img src = "https://avatars0.githubusercontent.com/u/10078572?v=4" width = "100px;" alt = "briandennis" / > < br / > < sub > < b > briandennis< / b > < / sub > < / a > < br / > < a href = "https://github.com/dawnlabs/carbon/commits?author=briandennis" title = "Code" > 💻< / a > < a href = "https://github.com/dawnlabs/carbon/commits?author=briandennis" title = "Documentation" > 📖< / a > < a href = "#infra-briandennis" title = "Infrastructure (Hosting, Build-Tools, etc)" > 🚇< / a > < a href = "#review-briandennis" title = "Reviewed Pull Requests" > 👀< / a > < / td > < td align = "center" > < a href = "https://github.com/mfix22" > < img src = "https://avatars0.githubusercontent.com/u/8397708?v=4" width = "100px;" alt = "mfix22" / > < br / > < sub > < b > mfix22< / b > < / sub > < / a > < br / > < a href = "#question-mfix22" title = "Answering Questions" > 💬< / a > < a href = "https://github.com/dawnlabs/carbon/commits?author=mfix22" title = "Code" > 💻< / a > < a href = "#ideas-mfix22" title = "Ideas, Planning, & Feedback" > 🤔< / a > < / td > < td align = "center" > < a href = "https://github.com/jakedex" > < img src = "https://avatars1.githubusercontent.com/u/10369094?v=4" width = "100px;" alt = "jakedex" / > < br / > < sub > < b > jakedex< / b > < / sub > < / a > < br / > < a href = "#question-jakedex" title = "Answering Questions" > 💬< / a > < a href = "https://github.com/dawnlabs/carbon/commits?author=jakedex" title = "Code" > 💻< / a > < a href = "#design-jakedex" title = "Design" > 🎨< / a > < a href = "#video-jakedex" title = "Videos" > 📹< / a > < / td > < td align = "center" > < a href = "https://github.com/andrewda" > < img src = "https://avatars1.githubusercontent.com/u/10191084?v=4" width = "100px;" alt = "andrewda" / > < br / > < sub > < b > andrewda< / b > < / sub > < / a > < br / > < a href = "#question-andrewda" title = "Answering Questions" > 💬< / a > < a href = "https://github.com/dawnlabs/carbon/commits?author=andrewda" title = "Code" > 💻< / a > < a href = "https://github.com/dawnlabs/carbon/issues?q=author%3Aandrewda" title = "Bug reports" > 🐛< / a > < a href = "#review-andrewda" title = "Reviewed Pull Requests" > 👀< / a > < / td > < td align = "center" > < a href = "https://github.com/yeskunall" > < img src = "https://avatars2.githubusercontent.com/u/14703164?v=4" width = "100px;" alt = "yeskunall" / > < br / > < sub > < b > yeskunall< / b > < / sub > < / a > < br / > < a href = "https://github.com/dawnlabs/carbon/commits?author=yeskunall" title = "Code" > 💻< / a > < a href = "https://github.com/dawnlabs/carbon/commits?author=yeskunall" title = "Documentation" > 📖< / a > < a href = "#tool-yeskunall" title = "Tools" > 🔧< / a > < a href = "https://github.com/dawnlabs/carbon/issues?q=author%3Ayeskunall" title = "Bug reports" > 🐛< / a > < / td > < td align = "center" > < a href = "https://github.com/stoshfabricius" > < img src = "https://avatars1.githubusercontent.com/u/2652676?v=4" width = "100px;" alt = "stoshfabricius" / > < br / > < sub > < b > stoshfabricius< / b > < / sub > < / a > < br / > < a href = "https://github.com/dawnlabs/carbon/commits?author=stoshfabricius" title = "Code" > 💻< / a > < / td > < td align = "center" > < a href = "https://github.com/jkling38" > < img src = "https://avatars1.githubusercontent.com/u/11639896?v=4" width = "100px;" alt = "jkling38" / > < br / > < sub > < b > jkling38< / b > < / sub > < / a > < br / > < a href = "https://github.com/dawnlabs/carbon/commits?author=jkling38" title = "Documentation" > 📖< / a > < / td > < / tr > < tr > < td align = "center" > < a href = "https://github.com/otobrglez" > < img src = "https://avatars1.githubusercontent.com/u/225946?v=4" width = "100px;" alt = "otobrglez" / > < br / > < sub > < b > otobrglez< / b > < / sub > < / a > < br / > < a href = "https://github.com/dawnlabs/carbon/commits?author=otobrglez" title = "Code" > 💻< / a > < / td > < td align = "center" > < a href = "https://github.com/darahak" > < img src = "https://avatars3.githubusercontent.com/u/11488612?v=4" width = "100px;" alt = "darahak" / > < br / > < sub > < b > darahak< / b > < / sub > < / a > < br / > < a href = "https://github.com/dawnlabs/carbon/commits?author=darahak" title = "Documentation" > 📖< / a > < / td > < td align = "center" > < a href = "https://github.com/dom96" > < img src = "https://avatars0.githubusercontent.com/u/246651?v=4" width = "100px;" alt = "dom96" / > < br / > < sub > < b > dom96< / b > < / sub > < / a > < br / > < a href = "https://github.com/dawnlabs/carbon/commits?author=dom96" title = "Code" > 💻< / a > < / td > < td align = "center" > < a href = "https://github.com/elrumordelaluz" > < img src = "https://avatars3.githubuserco
<!-- ALL - CONTRIBUTORS - LIST:END -->