Text Templater
Menu
Home
About
Documentation
GitHub
Toggle theme
Pastebin URL
Get Template
GitHub Gist URL
Get Template
Input Template
[nobr] [div=display: none;] &Font Call \ group&[font=&Title Font \ text \ DM Serif Display&]@fluticasone[/font] [font=&Body Font \ text \Inter&]@fluticasone[/font]&end& [/div] [div=&Variable-Set Up \ group&--accFont: '&Title Font \ text \ DM Serif Display&', serif; --bodyFont: '&Body Font \ text \ Inter&', sans-serif; --accColor: &Accent Color \ text \ #798cdd&; --txtColor: &Text Color \ text \ #484848&; --bgColor: &Background Color \ text \ rgba(238,238,238,.6)&; --borderColor: &Text Color \ text \#e6e6e6&; --charaIMG: url(&Image URL \ text \ https://i.imgur.com/i8eiNFx.jpeg&end&); position: relative; overflow: hidden; box-sizing: border-box; margin: 1rem auto; container-type: inline-size; width: clamp(200px,calc(100% - 2rem),600px); padding-left: clamp(2rem,24%,150px); font-size: initial;] [div=display: block; height: clamp(150px,60cqw,60cqw);] [/div] [div=z-index: 1; /* color blob */ position: absolute; top: 0px; left: 0px; width: 82%; height: 100%; display: block; mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='479' height='481' version='1.2'%3E%3Cpath d='M395 118.9c59.2 34.4 100.1 123.6 77.7 188.9-22.9 65.2-108.5 106.1-182.2 122.5-73.6 16-135.3 7.2-169.7-22.8-34.4-30.1-42-81.3-66.9-142.1-25.2-61.3-67.6-132.1-49.6-157 18-25.2 96.5-4.4 174.9-4 78.5.4 156.2-20 215.8 14.5z' style='fill:%23000'/%3E%3C/svg%3E%0A"); background-color: var(--accColor); mask-size: contain; mask-repeat: no-repeat; pointer-events: none;] [/div] &Main Content \ group&[div=z-index: 5; /* name area */ display: block; width: 100%; box-sizing: border-box; position: absolute; padding-left: clamp(2rem,24%,150px); top: clamp(150px,60cqw,60cqw); left: 0px; text-align: center; font-size: 6rem; font-family: var(--accFont); letter-spacing: -.05em; filter: drop-shadow(3px 3px 0px var(--accColor)); line-height: .8; transform: translateY(-50%); pointer-events: none;] &Character Name \ text \ name here& [/div] [div=z-index: 3; /* image blob */ position: absolute; top: 0px; left: 0px; width: 82%; height: 100%; display: block; mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='479' height='481' version='1.2'%3E%3Cpath d='M227.8 317.6c-29.1 24.9-45.2 46.8-68.6 56.1-23.6 9.3-54.2 6.5-77.8-8.6C57.7 350 41 323 34.3 292.9c-6.8-30.2-3.8-63.3 11.4-94.2 15-31 42.2-59.6 79.7-74.2 37.4-14.6 84.9-15 122.5 6.3 37.8 21 65.2 63.4 58.1 98.9-7.1 35.2-49.2 63.2-78.2 87.9z' style='fill:%23000'/%3E%3C/svg%3E%0A"); mask-size: contain; mask-repeat: no-repeat; pointer-events: none;] [div=position: relative; display: block; width: 70%; top: 11%; aspect-ratio: 278/266; background: var(--charaIMG) center center/cover no-repeat;] [/div] [/div] [div=z-index: 4; /* squiggle */ position: absolute; top: 0px; left: 0px; width: 82%; height: 100%; mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='479' height='481' version='1.2'%3E%3Cpath d='M395.9 85c37.9 41.4 73.5 82 65.7 114.8-8.1 32.5-59.1 57.6-97.3 109.8-37.9 52.1-63 131.8-114.4 158.4-51.8 27.1-130.3 1.2-168.9-51-38.7-52.5-37.1-131-17.4-189.7 19.7-58.8 57.6-97.8 96.2-139.2 38.7-41.7 77.7-85 117.5-85.8 39.8-.7 80.4 41 118.6 82.7z' style='fill:transparent;stroke:%23e6e6e6;paint-order:stroke fill markers;stroke-linejoin:round;stroke-width:1px'/%3E%3C/svg%3E%0A"); background-color: var(--borderColor); mask-size: contain; mask-repeat: no-repeat; pointer-events: none;] [/div] [div=z-index: 2; /* blurb area */ display: block; box-sizing: border-box; width: 100%; border: 1px solid var(--borderColor); background: var(--bgColor); overflow: hidden; padding: clamp(1rem,10%,55px); border-radius: 5px; position: relative;] [div=display: block; width: calc(100% + 125px); padding-right: 125px; box-sizing: border-box; height: 20rem; font-family: var(--bodyFont); color: var(--txtColor); overflow-x: hidden; overflow-y: scroll; font-size: .95rem; text-align: justify; scrollbar-gutter: stable both-edges;] [div=display: block; height: 1rem;] [/div] [div=display: block; margin-bottom: .5em;] &Character Blurb \ content& [/div] [/div] [/div]&end& &Basic Information \ group&[div=display: flex; /* basic info */ gap: .75rem .5rem; margin-bottom: 2rem; padding: .75rem 2rem; box-sizing: border-box; width: 100%; flex-flow: row wrap; align-items: flex-end; justify-content: flex-end; font-family: var(--accFont); font-size: .85rem; text-transform: uppercase;] &Information Line \ group \ repeat&[div=flex: 0 auto;]&Info (Click duplicate for more) \ text \ pronouns, age, etc.&[/div]&end& [/div]&end& [/div] [/nobr]
Generate Form Fields
Debug Mode
[ "[nobr]\r\n [div=display: none;]\r\n ", { "type": "group", "description": "Font Call", "markerStart": { "type": "group", "description": "Font Call", "original": "&Font Call \\ group&", "repeat": false, "indices": [ 36, 54 ] }, "repeat": false, "originalChildren": [ "[font=", { "type": "text", "description": "Title Font", "marker": { "type": "text", "description": "Title Font", "defaultValue": "DM Serif Display", "original": "&Title Font \\ text \\ DM Serif Display&", "indices": [ 61, 98 ] }, "value": "DM Serif Display" }, "]@fluticasone[/font]\r\n [font=", { "type": "text", "description": "Body Font", "marker": { "type": "text", "description": "Body Font", "defaultValue": "Inter", "original": "&Body Font \\ text \\Inter&", "indices": [ 131, 155 ] }, "value": "Inter" }, "]@fluticasone[/font]" ], "children": [], "markerEnd": { "type": "end", "description": "end", "original": "&end&", "indices": [ 176, 180 ] } }, "\r\n [/div]\r\n [div=", { "type": "group", "description": "Variable-Set Up", "markerStart": { "type": "group", "description": "Variable-Set Up", "original": "&Variable-Set Up \\ group&", "repeat": false, "indices": [ 200, 224 ] }, "repeat": false, "originalChildren": [ "--accFont: '", { "type": "text", "description": "Title Font", "marker": { "type": "text", "description": "Title Font", "defaultValue": "DM Serif Display", "original": "&Title Font \\ text \\ DM Serif Display&", "indices": [ 237, 274 ] }, "value": "DM Serif Display" }, "', serif;\r\n --bodyFont: '", { "type": "text", "description": "Body Font", "marker": { "type": "text", "description": "Body Font", "defaultValue": "Inter", "original": "&Body Font \\ text \\ Inter&", "indices": [ 301, 326 ] }, "value": "Inter" }, "', sans-serif;\r\n --accColor: ", { "type": "text", "description": "Accent Color", "marker": { "type": "text", "description": "Accent Color", "defaultValue": "#798cdd", "original": "&Accent Color \\ text \\ #798cdd&", "indices": [ 357, 387 ] }, "value": "#798cdd" }, ";\r\n --txtColor: ", { "type": "text", "description": "Text Color", "marker": { "type": "text", "description": "Text Color", "defaultValue": "#484848", "original": "&Text Color \\ text \\ #484848&", "indices": [ 405, 433 ] }, "value": "#484848" }, ";\r\n --bgColor: ", { "type": "text", "description": "Background Color", "marker": { "type": "text", "description": "Background Color", "defaultValue": "rgba(238,238,238,.6)", "original": "&Background Color \\ text \\ rgba(238,238,238,.6)&", "indices": [ 450, 497 ] }, "value": "rgba(238,238,238,.6)" }, ";\r\n --borderColor: ", { "type": "text", "description": "Text Color", "marker": { "type": "text", "description": "Text Color", "defaultValue": "#e6e6e6", "original": "&Text Color \\ text \\#e6e6e6&", "indices": [ 518, 545 ] }, "value": "#e6e6e6" }, ";\r\n --charaIMG: url(", { "type": "text", "description": "Image URL", "marker": { "type": "text", "description": "Image URL", "defaultValue": "https://i.imgur.com/i8eiNFx.jpeg", "original": "&Image URL \\ text \\ https://i.imgur.com/i8eiNFx.jpeg&", "indices": [ 567, 619 ] }, "value": "https://i.imgur.com/i8eiNFx.jpeg" }, "end&);\r\n position: relative;\r\n overflow: hidden;\r\n box-sizing: border-box;\r\n margin: 1rem auto; \r\n container-type: inline-size;\r\n width: clamp(200px,calc(100% - 2rem),600px);\r\n padding-left: clamp(2rem,24%,150px);\r\n font-size: initial;]\r\n [div=display: block;\r\n height: clamp(150px,60cqw,60cqw);]\r\n\r\n [/div]\r\n [div=z-index: 1; /* color blob */\r\n position: absolute;\r\n top: 0px;\r\n left: 0px;\r\n width: 82%;\r\n height: 100%;\r\n display: block;\r\n mask-image: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='479' height='481' version='1.2'%3E%3Cpath d='M395 118.9c59.2 34.4 100.1 123.6 77.7 188.9-22.9 65.2-108.5 106.1-182.2 122.5-73.6 16-135.3 7.2-169.7-22.8-34.4-30.1-42-81.3-66.9-142.1-25.2-61.3-67.6-132.1-49.6-157 18-25.2 96.5-4.4 174.9-4 78.5.4 156.2-20 215.8 14.5z' style='fill:%23000'/%3E%3C/svg%3E%0A\");\r\n background-color: var(--accColor);\r\n mask-size: contain;\r\n mask-repeat: no-repeat;\r\n pointer-events: none;]\r\n\r\n [/div]\r\n ", { "type": "group", "description": "Main Content", "markerStart": { "type": "group", "description": "Main Content", "original": "&Main Content \\ group&", "repeat": false, "indices": [ 1633, 1654 ] }, "repeat": false, "originalChildren": [ "[div=z-index: 5; /* name area */\r\n display: block;\r\n width: 100%;\r\n box-sizing: border-box;\r\n position: absolute;\r\n padding-left: clamp(2rem,24%,150px);\r\n top: clamp(150px,60cqw,60cqw);\r\n left: 0px;\r\n text-align: center;\r\n font-size: 6rem;\r\n font-family: var(--accFont);\r\n letter-spacing: -.05em;\r\n filter: drop-shadow(3px 3px 0px var(--accColor));\r\n line-height: .8;\r\n transform: translateY(-50%);\r\n pointer-events: none;]\r\n ", { "type": "text", "description": "Character Name", "marker": { "type": "text", "description": "Character Name", "defaultValue": "name here", "original": "&Character Name \\ text \\ name here&", "indices": [ 2131, 2165 ] }, "value": "name here" }, "\r\n [/div]\r\n [div=z-index: 3; /* image blob */\r\n position: absolute;\r\n top: 0px;\r\n left: 0px;\r\n width: 82%;\r\n height: 100%;\r\n display: block;\r\n mask-image: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='479' height='481' version='1.2'%3E%3Cpath d='M227.8 317.6c-29.1 24.9-45.2 46.8-68.6 56.1-23.6 9.3-54.2 6.5-77.8-8.6C57.7 350 41 323 34.3 292.9c-6.8-30.2-3.8-63.3 11.4-94.2 15-31 42.2-59.6 79.7-74.2 37.4-14.6 84.9-15 122.5 6.3 37.8 21 65.2 63.4 58.1 98.9-7.1 35.2-49.2 63.2-78.2 87.9z' style='fill:%23000'/%3E%3C/svg%3E%0A\");\r\n mask-size: contain;\r\n mask-repeat: no-repeat;\r\n pointer-events: none;]\r\n [div=position: relative;\r\n display: block;\r\n width: 70%;\r\n top: 11%;\r\n aspect-ratio: 278/266;\r\n background: var(--charaIMG) center center/cover no-repeat;]\r\n\r\n [/div]\r\n [/div]\r\n [div=z-index: 4; /* squiggle */\r\n position: absolute;\r\n top: 0px;\r\n left: 0px;\r\n width: 82%;\r\n height: 100%;\r\n mask-image: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='479' height='481' version='1.2'%3E%3Cpath d='M395.9 85c37.9 41.4 73.5 82 65.7 114.8-8.1 32.5-59.1 57.6-97.3 109.8-37.9 52.1-63 131.8-114.4 158.4-51.8 27.1-130.3 1.2-168.9-51-38.7-52.5-37.1-131-17.4-189.7 19.7-58.8 57.6-97.8 96.2-139.2 38.7-41.7 77.7-85 117.5-85.8 39.8-.7 80.4 41 118.6 82.7z' style='fill:transparent;stroke:%23e6e6e6;paint-order:stroke fill markers;stroke-linejoin:round;stroke-width:1px'/%3E%3C/svg%3E%0A\");\r\n background-color: var(--borderColor);\r\n mask-size: contain;\r\n mask-repeat: no-repeat;\r\n pointer-events: none;]\r\n \r\n [/div]\r\n [div=z-index: 2; /* blurb area */\r\n display: block;\r\n box-sizing: border-box;\r\n width: 100%;\r\n border: 1px solid var(--borderColor);\r\n background: var(--bgColor);\r\n overflow: hidden;\r\n padding: clamp(1rem,10%,55px);\r\n border-radius: 5px;\r\n position: relative;]\r\n [div=display: block;\r\n width: calc(100% + 125px);\r\n padding-right: 125px;\r\n box-sizing: border-box;\r\n height: 20rem;\r\n font-family: var(--bodyFont);\r\n color: var(--txtColor);\r\n overflow-x: hidden;\r\n overflow-y: scroll;\r\n font-size: .95rem;\r\n text-align: justify;\r\n scrollbar-gutter: stable both-edges;]\r\n [div=display: block; height: 1rem;] [/div]\r\n [div=display: block; margin-bottom: .5em;]\r\n ", { "type": "content", "description": "Character Blurb", "marker": { "type": "content", "description": "Character Blurb", "original": "&Character Blurb \\ content&", "indices": [ 4607, 4633 ] } }, "\r\n [/div]\r\n [/div]\r\n [/div]" ], "children": [], "markerEnd": { "type": "end", "description": "end", "original": "&end&", "indices": [ 4676, 4680 ] } }, "\r\n ", { "type": "group", "description": "Basic Information", "markerStart": { "type": "group", "description": "Basic Information", "original": "&Basic Information \\ group&", "repeat": false, "indices": [ 4687, 4713 ] }, "repeat": false, "originalChildren": [ "[div=display: flex; /* basic info */\r\n gap: .75rem .5rem;\r\n margin-bottom: 2rem;\r\n padding: .75rem 2rem;\r\n box-sizing: border-box;\r\n width: 100%;\r\n flex-flow: row wrap;\r\n align-items: flex-end;\r\n justify-content: flex-end;\r\n font-family: var(--accFont);\r\n font-size: .85rem;\r\n text-transform: uppercase;]\r\n ", { "type": "group", "description": "Information Line", "markerStart": { "type": "group", "description": "Information Line", "original": "&Information Line \\ group \\ repeat&", "repeat": true, "indices": [ 5059, 5093 ] }, "repeat": true, "originalChildren": [ "[div=flex: 0 auto;]", { "type": "text", "description": "Info (Click duplicate for more)", "marker": { "type": "text", "description": "Info (Click duplicate for more)", "defaultValue": "pronouns, age, etc.", "original": "&Info (Click duplicate for more) \\ text \\ pronouns, age, etc.&", "indices": [ 5113, 5174 ] }, "value": "pronouns, age, etc." }, "[/div]" ], "children": [], "markerEnd": { "type": "end", "description": "end", "original": "&end&", "indices": [ 5181, 5185 ] } }, "\r\n [/div]" ], "children": [], "markerEnd": { "type": "end", "description": "end", "original": "&end&", "indices": [ 5198, 5202 ] } }, "\r\n [/div]\r\n[/nobr]" ], "children": [] } ]
[ { "type": "MissingEnd", "marker": { "type": "group", "description": "Variable-Set Up", "original": "&Variable-Set Up \\ group&", "repeat": false, "indices": [ 200, 224 ] } } ]
nerveimpulse.template 1.0
By glucoseguardian
Font Call
Title Font
Body Font
Variable-Set Up
Title Font
Body Font
Accent Color
Text Color
Background Color
Text Color
Image URL
Main Content
Character Name
Character Blurb
Basic Information
Information Line
Duplicate
Info (Click duplicate for more)
Generate Final Output
Output