Copy and Paste

Download

Local storage on your browser

Cloud storage

Copy and Paste

Upload file

Background

• http://www.1kfa.com/table/svg/bg_topography.svg
• http://www.1kfa.com/table/svg/bg_hexagons.svg
• http://www.1kfa.com/table/svg/bg_clouds.svg
• http://www.1kfa.com/table/svg/bg_graphpaper.svg
• http://www.1kfa.com/table/svg/bg_winter_sun.svg
• http://www.1kfa.com/table/svg/bg_wiggle.svg

Size

Examples:

Try pasting this into the box:

<svg xmlns="http://www.w3.org/2000/svg"
  x="0" y="0" width="100" height="100">
  <rect x="25" y="25" width="50" height="50" style="fill:#ff0000" />
  <script
    type="text/javascript"
    data-namespace="myThing"
  ><![CDATA[

myThing = {

  menu: {
    'Change Color': {
      eventName: 'changeMyColor',
      applicable: (elem) => { return true },
      uiLabel: (elem) => { return 'Change Color To Green' },
      handler: function(evt) {
        // Note - "handler" must be written as a traditional function,
        // not an arrow-function, so that "this" is bound correctly
        // console.log('Changing color!')
        this.querySelector('rect').style['fill'] = '#00ff00'
      },
    },
  },

}

]]></script>
</svg>
  

Drawing

SVG File

Rectangle

Circle

Text

Image

Dynamic Tray

Dynamic Trays will automatically do calculations based on the dice (or other objects like text) placed inside them

Decks

Single poker card

Solid color

Image token

Front	Back

Custom SVG

Examples:

Try pasting these into the box:

Try this for the front / back in order to create a "poker chip" token that will interact with Dynamic Tray to do things like quickly calculate their sum.
<circle r="36" cy="45" cx="40" fill="black" /> <text x="24" y="65" fill="white" style="font-size:60px"> <tspan>5</tspan> </text>	<circle r="36" cy="45" cx="40" fill="white" /> <text x="24" y="65" fill="black" style="font-size:60px"> <tspan>5</tspan> </text>
Standee-style tokens can be made with the HeroForge customization tool or with OpenPeeps (which is nicer because it lets you just copy the URL)
<image href="img/standee_hero_front.png" width="80" height="100" />	<image href="https://blush.design/api/download?shareUri=zesJJD5hU&s=0%7ED08B5B&w=400&h=400&fm=png" width="80" height="100" />

Controls

To remove cards from a deck, double-click on the deck.

To remove objects from a Dynamic Tray, double-click it.

To resize a Dynamic Tray, double-click it, then drag the gray square handle in the lower corner.

To select multiple dice, hold Shift and click on each one.

To zoom in/out, hold Ctrl and roll your mouse wheel.

Surf The Geek Ring

Give some recognition

Contribute to the codebase

Donate