Adding Status Badges
Cloud Server v3.x Server v2.x This document describes how to create a badge that displays your project’s build status (passed or failed) in a README or other document.
Overview
Status badges are commonly embedded in project READMEs, although they can be placed in any web document. CircleCI provides a tool to generate embed code for status badges. By default, a badge displays the status of a project’s default branch, though you can also display the status of specific branches.
A badge status allows teams to quickly see build statuses in their repo. Badges change appearance depending on their status (success, failure).
You can generate code for the following formats:
- Image URL
- Markdown
- Textile
- Rdoc
- AsciiDoc
- reStructuredText
- pod
Generating a status badge
To generate your own status badge, you will need to know, and substitute, the following variables in the code snippets below:
-
<PROJECT_NAME>- Your project’s name. Example:circleci-docs -
<ORG_NAME>- The organization or user name the project in question belongs to -
<VCS>- your VCS provider (ghfor “github” andbbfor BitBucket) -
<LINK>- The link you want the status badge to go to when clicked (example: the pipeline overview page) - Optional: an API token (to create badges for private projects)
The following examples demonstrate how to generate a status badge for various template languages. Each example also provides a status badge code for a specific branch.
# Template:
[](<LINK>)
# Example:
[](https://circleci.com/gh/circleci/circleci-docs)
# Example for specific branch:
[](https://circleci.com/gh/circleci/circleci-docs/?branch=teesloane-patch-5)
# Template:
!https://circleci.com/<VCS>/<ORG_NAME>/<PROJECT_NAME>.svg?style=svg!:<LINK>
# Example:
!https://circleci.com/gh/circleci/circleci-docs.svg?style=svg!:https://circleci.com/gh/circleci/circleci-docs
# Example for specific branch:
!https://circleci.com/gh/circleci/circleci-docs/tree/teesloane-patch-5.svg?style=svg!:https://circleci.com/gh/circleci/circleci-docs/?branch=teesloane-patch-5
# Template:
{<img src="https://circleci.com/<VCS>/<ORG_NAME>/<PROJECT_NAME>.svg?style=svg" alt="<ORG_NAME>" />}[https://circleci.com/gh/<ORG_NAME>/<PROJECT_NAME>]
# Example:
{<img src="https://circleci.com/gh/circleci/circleci-docs.svg?style=svg" alt="CircleCI" />}[https://circleci.com/gh/circleci/circleci-docs]
# Example for specific branch:
{<img src="https://circleci.com/gh/circleci/circleci-docs/tree/teesloane-patch-5.svg?style=svg" alt="CircleCI" />}[https://circleci.com/gh/circleci/circleci-docs/?branch=teesloane-patch-5]
# Template:
image:https://circleci.com/<VCS>/<ORG_NAME>/<PROJECT_NAME>.svg?style=svg["<ORG_NAME>", link="https://circleci.com/<VCS>/<ORG_NAME>/<PROJECT_NAME>"]
# Example:
image:https://circleci.com/gh/circleci/circleci-docs.svg?style=svg["CircleCI", link="https://circleci.com/gh/circleci/circleci-docs"]
# Example for specific branch:
image:https://circleci.com/gh/circleci/circleci-docs/tree/teesloane-patch-5.svg?style=svg["CircleCI", link="https://circleci.com/gh/circleci/circleci-docs/?branch=teesloane-patch-5"]
# Template:
.. image:: https://circleci.com/<VCS>/<ORG_NAME>/<PROJECT_NAME>.svg?style=svg
:target: https://circleci.com/<VCS>/<ORG_NAME>/<PROJECT_NAME>
# Example:
.. image:: https://circleci.com/gh/circleci/circleci-docs.svg?style=svg
:target: https://circleci.com/gh/circleci/circleci-docs
# Example for specific branch:
.. image:: https://circleci.com/gh/circleci/circleci-docs/tree/teesloane-patch-5.svg?style=svg
:target: https://circleci.com/gh/circleci/circleci-docs/?branch=teesloane-patch-5
# Template:
=for HTML <a href="https://circleci.com/<VCS>/<ORG_NAME>/<PROJECT_NAME>"><img src="https://circleci.com/<VCS>/<ORG_NAME>/<PROJECT_NAME>.svg?style=svg"></a>
# Example:
=for HTML <a href="https://circleci.com/gh/circleci/circleci-docs"><img src="https://circleci.com/gh/circleci/circleci-docs.svg?style=svg"></a>
# Example for specific branch:
=for HTML <a href="https://circleci.com/gh/circleci/circleci-docs/?branch=teesloane-patch-5"><img src="https://circleci.com/gh/circleci/circleci-docs/tree/teesloane-patch-5.svg?style=svg"></a>
Creating badges for private repositories
NOTE: To create a status badge for a private project you will need to create an api token specifically scoped to “status” and include that token in the url string of your badge. Consider the following markdown image badge snippet against the original markdown example above; it has a URL parameter for a token added.
[](<LINK>)
To create a status API token, go to the CircleCI web app, navigate to a specific project, go to Project Settings -> API Permissions, and create a token scoped to status.
Different styles
If you find the default status badge too minimal, you can use the shield style. To use the shield style, replace style=svg with style=shield in the link you generated above.
See also
Help make this document better
This guide, as well as the rest of our docs, are open source and available on GitHub. We welcome your contributions.
- Suggest an edit to this page (please read the contributing guide first).
- To report a problem in the documentation, or to submit feedback and comments, please open an issue on GitHub.
- CircleCI is always seeking ways to improve your experience with our platform. If you would like to share feedback, please join our research community.
Need support?
Our support engineers are available to help with service issues, billing, or account related questions, and can help troubleshoot build configurations. Contact our support engineers by opening a ticket.
You can also visit our support site to find support articles, community forums, and training resources.
CircleCI Documentation by CircleCI is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International License.
