Scripty.sol

is a gas efficient, storage agnostic, on-chain HTML builder optimised for stitching together large JavaScript based tags.

Generate Convert Improve

Install / Use

/learn @intartnft/Scripty.sol

About this skill

Quality Score

0/100

README

scripty.sol

scripty.sol is a gas efficient, storage agnostic, on-chain HTML builder optimised for stitching together large JavaScript based tags.

scripty.sol

Documentation

scripty.sol allows you to build HTML files directly on-chain with minimal gas cost. Some benefits of using scripty.sol:

Gas efficient. It utilises DynamicBuffer to save huge amount of gas while assembling scripts together.
scripty.sol is storage agnostic. You can use any on-chain storage solutions available.
You can build modular JS based HTML files directly on-chain.
You can dynamically inject data into your HTML.

Platforms using scripty.sol

Projects using scripty.sol

Protocols using scripty.sol

Mint

Installation

Contracts and verified scripts(JS) are published through npm:

npm install scripty.sol --save-dev

Example

The example below generates a simple HTML with fullsize canvas element and a script element that draws a rectangle on the canvas:

// Create head tags
HTMLTag[] memory headTags = new HTMLTag[](1);
headTags[0].tagOpen = "<style>";
headTags[0].tagContent = "html{height:100%}body{min-height:100%;margin:0;padding:0}canvas{padding:0;margin:auto;display:block;position:absolute;top:0;bottom:0;left:0;right:0}";
headTags[0].tagClose = "</style>";

// Create body tags
HTMLTag[] memory bodyTags = new HTMLTag[](2);
bodyTags[0].tagOpen = '<canvas id="myCanvas">';
bodyTags[0].tagClose = "</canvas>";

bodyTags[1].tagContent = 'const canvas=document.getElementById("myCanvas"),ctx=canvas.getContext("2d");ctx.beginPath(),ctx.rect(20,20,150,100),ctx.stroke();';
bodyTags[1].tagType = HTMLTagType.script;

// Create HTML request with head and body tags
HTMLRequest memory htmlRequest;
htmlRequest.headTags = headTags;
htmlRequest.bodyTags = bodyTags;

// Get full HTML string
string memory htmlString = IScriptyBuilderV2(
    scriptyBuilderAddress
).getHTMLString(htmlRequest);

HTML file output:

<html>
  <head>
    <style>
      html {
        height: 100%
      }

      body {
        min-height: 100%;
        margin: 0;
        padding: 0
      }

      canvas {
        padding: 0;
        margin: auto;
        display: block;
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0
      }
    </style>
  </head>
  <body>
    <canvas id="myCanvas"></canvas>
    <script>
      const canvas = document.getElementById("myCanvas");
      const ctx = canvas.getContext("2d");

      ctx.beginPath();
      ctx.rect(20, 20, 150, 100);
      ctx.stroke();
    </script>
  </body>
</html>

Deployed Contracts

Live Examples

Stacked 3D Objects Shapes - NFT1 NFT2

Both NFTs assemble PNG compressed base 64 encoded three.js with an uncompressed demo scene. First NFT creates some 3D cubes. Second NFT gets the first NFT scene on-chain and adds spheres.

p5js from EthFS FileStore V2

Assembles base64 encoded p5.js that's stored in ethfs's FileStore contract with a demo scene. Metadata and animation URL are both base64 encoded.

p5js from EthFS FileStore V2 - URL Safe

Assembles base64 encoded p5.js that's stored in ethfs's FileStore contract with a demo scene. Metadata and animation URL are both URL encoded.

Assembles multiple uncompressed scripts that draw shapes on same <canvas></canvas> element with a controller script that is created in NFT contract. This controller script passes some chain parameters to canvas scene.

Cube3D - GZIP Compressed - BASE64 Encoded

Assembles GZIP compressed Base64 encoded three.js with a demo scene. Metadata and animation URL are both base64 encoded.

Cube3D - GZIP Compressed - URL Safe

Assembles GZIP compressed base64 encoded three.js with a demo scene. Metadata and animation URL are both URL encoded.

Cube3D - PNG Compressed - URL Safe

Assembles PNG compressed base64 encoded three.js with a demo scene. Metadata and animation URL are both URL encoded.

Cube3D - PNG Compressed - URL Safe with custom wrap

Assembles PNG compressed base64 encoded three.js with a demo scene. Metadata and animation URL are both URL encoded. It uses custom script wraps.

ThreeJS Module - GZIP Compressed - URL Safe with custom wrap

Assembles GZIP compressed base64 encoded modular three.js with a demo scene. Metadata and animation URL are both URL encoded. It uses custom script wraps. This is the most complex of all the examples. It demonstrates how to:

dynamically inject data into your javascript code
load gzipped javascript modules in the desired order, using gzipped es-module-shim for full browser support
embed custom javascript
make it

Related Skills

node-connect

344.1k

Diagnose OpenClaw node connection and pairing failures for Android, iOS, and macOS companion apps

frontend-design

96.8k

Create distinctive, production-grade frontend interfaces with high design quality. Use this skill when the user asks to build web components, pages, or applications. Generates creative, polished code that avoids generic AI aesthetics.

openai-whisper-api

344.1k

Transcribe audio via OpenAI Audio Transcriptions API (Whisper).

qqbot-media

344.1k

QQBot 富媒体收发能力。使用 <qqmedia> 标签，系统根据文件扩展名自动识别类型（图片/语音/视频/文件）。

intartnft

View profile

View on GitHub

GitHub Stars131

CategoryDevelopment

Updated4mo ago

Forks8

intartnft/scripty.sol

Languages

Solidity

Security Score

92/100

Audited on Nov 8, 2025

No findings

Scripty.sol

Install / Use

README

scripty.sol

Platforms using scripty.sol

Projects using scripty.sol

Protocols using scripty.sol

Installation

Example

HTML file output:

Deployed Contracts

Ethereum Mainnet

Ethereum Goerli

Ethereum Sepolia

Ethereum Holesky

Base

Base Sepolia

Optimism

Optimism Sepolia

Live Examples

Stacked 3D Objects Shapes - NFT1 NFT2

Related Skills