<p>社員の HP を見える化している<a href="https://onken.co.jp/" target="_blank" rel="nofollow noopener noreferrer">音研</a>さんの<a href="https://twitter.com/onkenkenken/status/1540948590348337152?s=20&amp;t=XMrwMEEM7q-7d5sXWnyF3g" target="_blank" rel="nofollow noopener noreferrer">ツイート</a>を拝見し、Github の README に貼りたくなったので、バッジを作りました！</p>
<p><img src="https://res.cloudinary.com/zenn/image/fetch/s--27-BCRwV--/c_limit%2Cf_auto%2Cfl_progressive%2Cq_auto%2Cw_1200/https://condition-badge.herokuapp.com/%3Fname%3Dogty%26max%3D10000%26current%3D999%26flash%3DTrue" alt loading="lazy" class="md-img"></p>
<h2 id="%E4%BD%BF%E3%81%84%E6%96%B9">
<a class="header-anchor-link" href="#%E4%BD%BF%E3%81%84%E6%96%B9" aria-hidden="true"></a> 使い方</h2>
<p><code>https://condition-badge.herokuapp.com/?name=ogty&amp;max=10000&amp;current=999&amp;flash=True</code></p>
<ul>
<li>
<code>max</code>：HP の最大値</li>
<li>
<code>current</code>：残りの HP</li>
<li>
<code>flash</code>：点滅</li>
</ul>
<p>点滅は <strong>10%</strong> 以下にならないと点滅しないようにしています。名前は現在は大文字のみです。</p>
<h2 id="%E6%9C%80%E5%BE%8C%E3%81%AB">
<a class="header-anchor-link" href="#%E6%9C%80%E5%BE%8C%E3%81%AB" aria-hidden="true"></a> 最後に</h2>
<p>気が向いたら、MP バージョンや小文字、フォントやフレームの形なんかも変えてみたいと思います。</p>
<p><span class="embed-block zenn-embedded zenn-embedded-card"><iframe id="zenn-embedded__70aa3ff22f8ab" src="https://embed.zenn.studio/card#zenn-embedded__70aa3ff22f8ab" data-content="https%3A%2F%2Fgithub.com%2Fogty%2Fmy-condition-badge" frameborder="0" scrolling="no" loading="lazy"></iframe></span><a href="https://github.com/ogty/my-condition-badge" style="display:none" target="_blank" rel="nofollow noopener noreferrer">https://github.com/ogty/my-condition-badge</a></p>


HP 見える化バッジ svg

使い方

最後に

Discussion