Fork me on GitHub
Nav Coin

Buttons for Use

Click to Copy

Nav Coin is a coin for people. Nav buttons seek to make it easier for people to send Nav as a way of thanks! The default button provides a simple copy to clipboard for your Nav address. Try it!

Use QR Codes

Nav buttons also support QR codes for even easier sharing. QR code enabled buttons take up a little more space, but provide copy functionality as well as the convenience of a QR code.

All Shapes and Sizes

Nav buttons can accommodate lots of different text, and can be displayed at various sizes. Pick a button size that is the right fit.

Alternative Buttons

If the classic Nav purple doesn't tickle your fancy, these alt buttons just might do the trick.

Click to Copy

Use QR Codes

Components

Everyone goes nuts for components. The Nav buttons package comes FULLY LOADED with React components.

import React from 'react';
import { NavButton } from 'nav-button/dist/nav-button-react';

const MyComponent = () => (
  <NavButton
    address="NhN5m1uE1QwySphDJVN4nc6WhiAB6TFjxt"
    text="Tip with Nav"
    actionText="Copy Address"
    onCopy={copyHandler}
  />
);
import React from 'react';
import { NavQrButton } from 'nav-button/dist/nav-button-react';

const MyComponent = () => (
  <NavQrButton
    address="NhN5m1uE1QwySphDJVN4nc6WhiAB6TFjxt"
    text="Pay with Nav"
    actionText="Show QR Code"
    onCopy={copyHandler}
    closeText="Thanks! Got it"
    alt={true}
  />
);

Embeddable Buttons

Sometimes you just want to paste some code and move on with your life. Nav buttons have you covered.

<script type="text/javascript">
(function(d, id) {
  if (!d.getElementById(id)) {
    var js;
    js = d.createElement("script");
    js.id = id;
    js.src = "//cdn.rawgit.com/brianium/nav-button/9073d20e5eb39fe97c48e0e0a076b69ed42e2f2c/nav-embed.js";
    d.head.appendChild(js);
  }
}(document, 'nav-embed-js'));
</script>
<div class="nav-btn-placeholder" data-class-name="mx-auto mb-3" data-text="Tip with Nav" data-action-text="Copy Address" data-address="NhN5m1uE1QwySphDJVN4nc6WhiAB6TFjxt"></div>
<script type="text/javascript">
(function(d, id) {
  if (!d.getElementById(id)) {
    var js;
    js = d.createElement("script");
    js.id = id;
    js.src = "//cdn.rawgit.com/brianium/nav-button/9073d20e5eb39fe97c48e0e0a076b69ed42e2f2c/nav-embed.js";
    d.head.appendChild(js);
  }
}(document, 'nav-embed-js'));
</script>
<div class="nav-btn-placeholder" data-class-name="mx-auto mb-3" data-text="Pay with Nav" data-action-text="Show QR Code" data-type="qr" data-address="NhN5m1uE1QwySphDJVN4nc6WhiAB6TFjxt"></div>

Thank You!

If you find these useful, please consider sending me some Nav. All of these demo buttons are pointing to my address.

I plan to develop on these further - including plugins for easily dropping them into popular content management platforms, starting with a WordPress plugin.