A monster's Constitution modifier also affects the number of Hit Points it has. Its Constitution modifier is multiplied by the number of Hit Dice it possesses, and the result is added to its Hit Points.For example, if a monster has a Constitution of 12 (+1 modifier) and 2d8 Hit Dice, it has 2d8 + 2 Hit Points (average 11). Speed A monster's speed tells you how far it can move on its turn. Traits Legendary Resistance (3/Day): If the tarrasque fails a saving throw, it can choose to succeed instead. Magic Resistance: The tarrasque has advantage on saving throws against spells and other magical effects. Reflective Carapace: Any time the tarrasque is targeted by a magic missile spell, a line spell, or a spell that requires a ranged attack roll, roll a d6.
Statblock5e provides an easy way to display a creature statblock that looksalmost exactly like the statblocks from the 5th edition D&D Monster Manual.
This is implemented as a set of custom elements following the WebComponents specs: ES Modules, CustomElements, and the Shadow DOM.
A spectator is a lesser beholder that is summoned from another plane of existence by a magical ritual, the components of which include four beholder eyestalks that are consumed by the ritual's magic. Appropriately, a spectator has four eyestalks, two on each side of the wide eye at the center of its four-foot diameter body. Magical Guardians. The gas spore resembles a beholder. A creature that can see the gas spore can discern its true nature with a successful DC 15 Intelligence (Nature) check. bDeath Burst./b The gas spore explodes when it drops to 0 hit points. Use to italicize and. to bold. For Spellcasting lists, use to reverse-indent.
While statblock5e has been tested the most in Chrome, it may also work in any browser that properly implements the Web Components v1 specs. Make sure you are using at least Chrome 61 or Firefox 63.
There are no dependencies (JavaScript or otherwise), this is entirelyself-contained.
There's very little JavaScript actually; just a bit of boilerplate thatdefines the custom elements and some minor logic for computing the ability modifiersfor the ability table. Other than that, it's pure HTML, CSS & SVG.
Here's the markup that produced the above picture. No user-level CSS orJavaScript is necessary.
The example text is copyright Wizards of the Coast; they make it available forfree on their website through the D&D 5E Basic Rules (it's in theDM supplement).
Dnd 5e Beholder Stat Block 5e
Visual differences from the MM statblocks
Unfortunately this statblock isn't quite pixel-perfect with regards to thestatblocks in the MM. The differences are:
- Different typefaces used. I'm told that the body typeface used in the MM is FF Scala Sans and the one used for the monster name headings is Mrs Eaves Petite Caps. They're not available for free from Google Fonts, so substitutes are used instead.
- No textured background. Obviously, I don't have access to the original textures WotC used. Even if I did, I'm not sure I'd use them since that would mean serving images which I wanted to avoid (scaling/resolution/deployment issues etc).
- No textured block border. Same as above.
There are probably other differences as well but I haven't noticed them. I triedto stick as close to the original as reasonably possible; for instance, I spentwaaay too much time getting the drop-shadow to be the 'correct' shade ofbrown and the tapered horizontal rule to render just right. Why? Because Ihad nothing better to do and it was fun! :)
FAQ
Dnd 5e Beholder Stat Block Maker
Is there a single-file version?
The demo.html file in the repository HTML-imports the other HTMLsource files. There's also demo-inlined.html which rendersexactly the same but has all the HTML-imports inlined directly into thedocument.
The Python script that produces the inlined version is alsoavailable.
Dnd 5e Beholder Stat Block
How do I make two-column layouts?
See the demo-two-column.html file (here's a renderedimage). The key thing to notice is the use of the data-two-columnattribute on the element. You can also use thedata-content-height attribute to tweak the layout. See thecomments in the demo file for details.
Why aren't you using polyfills?
While polyfills for Web Components do exist, they're not perfect andrequire a preprocessing stage that inlines all HTML imports and rewrites the newCSS selectors like :host, ::content, /deep/ etc. There's no easy way totie all this together and frankly, I don't care enough since I'll personallyonly use this for locally hosted pages rendered in Chrome.
If someone wants to do the required work to implement the whole preprocessingpipeline, pull requests are welcome.
Version History
0.0.5
- Updated to the WebComponents v1 spec, since several aspects of WebComponents v0 are being removed in Chrome 73.
- Use ES Modules instead of HTML Imports.
- Use Custom Elements v1 instead of
registerElement(). - Use
createShadowRoot()instead ofattachShadow(). - Use
instead of. - Define
data-content-heightas a CSS custom property instead of as an HTML attribute, so we don't have to use a javascript hack to set the height of the stat-block. - Rewrite
inline-imports.pyto parse the ES module and HTML template files.
0.0.4
- Fixed issue with text floating outside the statblock on Chrome 50+.
0.0.3
- Simpler way of supporting two-column layout.
0.0.2
can now be used for legendary actions since it doesn't hardcode red text.- Support for two-column layout! See the new item in the FAQ.
- Now supporting multiple
elements inside. All's after the first will have an indent like in the MM.
- Increasing h3 size to be closer to MM.
- Increasing line height of body font to be closer to MM.
- Using a new typeface for monster name heading. Should be closer to MM.
- Slightly increased body font size to be closer to MM font metrics.
0.0.1
- Initial release.
If someone wants to do the required work to implement the whole preprocessingpipeline, pull requests are welcome.
Version History
0.0.5
- Updated to the WebComponents v1 spec, since several aspects of WebComponents v0 are being removed in Chrome 73.
- Use ES Modules instead of HTML Imports.
- Use Custom Elements v1 instead of
registerElement(). - Use
createShadowRoot()instead ofattachShadow(). - Use
instead of. - Define
data-content-heightas a CSS custom property instead of as an HTML attribute, so we don't have to use a javascript hack to set the height of the stat-block. - Rewrite
inline-imports.pyto parse the ES module and HTML template files.
0.0.4
- Fixed issue with text floating outside the statblock on Chrome 50+.
0.0.3
- Simpler way of supporting two-column layout.
0.0.2
can now be used for legendary actions since it doesn't hardcode red text.- Support for two-column layout! See the new item in the FAQ.
- Now supporting multiple
elements inside. All's after the first will have an indent like in the MM.
- Increasing h3 size to be closer to MM.
- Increasing line height of body font to be closer to MM.
- Using a new typeface for monster name heading. Should be closer to MM.
- Slightly increased body font size to be closer to MM font metrics.
0.0.1
- Initial release.
License
Dnd 5e Beholder Stat Block Creator
This software is licensed under the Apache License, Version 2.0.
