Skip to main content
Helpful?

SVG

Git Source - Generated with forge doc

Provides a function for generating an SVG associated with a Uniswap NFT

Reference: https://github.com/Uniswap/v3-periphery/blob/main/contracts/libraries/NFTSVG.sol

State Variables​

curve1​

string constant curve1 = "M1 1C41 41 105 105 145 145";

curve2​

string constant curve2 = "M1 1C33 49 97 113 145 145";

curve3​

string constant curve3 = "M1 1C33 57 89 113 145 145";

curve4​

string constant curve4 = "M1 1C25 65 81 121 145 145";

curve5​

string constant curve5 = "M1 1C17 73 73 129 145 145";

curve6​

string constant curve6 = "M1 1C9 81 65 137 145 145";

curve7​

string constant curve7 = "M1 1C1 89 57.5 145 145 145";

curve8​

string constant curve8 = "M1 1C1 97 49 145 145 145";

Functions​

generateSVG​

Generate the SVG associated with a Uniswap v4 NFT

function generateSVG(SVGParams memory params) internal pure returns (string memory svg);

Parameters

NameTypeDescription
paramsSVGParamsThe SVGParams struct containing the parameters for the SVG

Returns

NameTypeDescription
svgstringThe SVG string associated with the NFT

generateSVGDefs​

Generate the SVG defs that create the color scheme for the SVG

function generateSVGDefs(SVGParams memory params) private pure returns (string memory svg);

Parameters

NameTypeDescription
paramsSVGParamsThe SVGParams struct containing the parameters to generate the SVG defs

Returns

NameTypeDescription
svgstringThe SVG defs string

generateSVGBorderText​

Generate the SVG for the moving border text displaying the quote and base currency addresses with their symbols

function generateSVGBorderText(
    string memory quoteCurrency,
    string memory baseCurrency,
    string memory quoteCurrencySymbol,
    string memory baseCurrencySymbol
) private pure returns (string memory svg);

Parameters

NameTypeDescription
quoteCurrencystringThe quote currency
baseCurrencystringThe base currency
quoteCurrencySymbolstringThe quote currency symbol
baseCurrencySymbolstringThe base currency symbol

Returns

NameTypeDescription
svgstringThe SVG for the border NFT's border text

generateSVGCardMantle​

Generate the SVG for the card mantle displaying the quote and base currency symbols and fee tier

function generateSVGCardMantle(
    string memory quoteCurrencySymbol,
    string memory baseCurrencySymbol,
    string memory feeTier
) private pure returns (string memory svg);

Parameters

NameTypeDescription
quoteCurrencySymbolstringThe quote currency symbol
baseCurrencySymbolstringThe base currency symbol
feeTierstringThe fee tier

Returns

NameTypeDescription
svgstringThe SVG for the card mantle

generageSvgCurve​

Generate the SVG for the curve that represents the position. Fade up (top is faded) if current price is above your position range, fade down (bottom is faded) if current price is below your position range Circles are generated at the ends of the curve if the position is in range, or at one end of the curve it is on if not in range

function generageSvgCurve(int24 tickLower, int24 tickUpper, int24 tickSpacing, int8 overRange)
    private
    pure
    returns (string memory svg);

Parameters

NameTypeDescription
tickLowerint24The lower tick
tickUpperint24The upper tick
tickSpacingint24The tick spacing
overRangeint8Whether the current tick is in range, over range, or under range

Returns

NameTypeDescription
svgstringThe SVG for the curve

getCurve​

Get the curve based on the tick range The smaller the tick range, the smaller/more linear the curve

function getCurve(int24 tickLower, int24 tickUpper, int24 tickSpacing) internal pure returns (string memory curve);

Parameters

NameTypeDescription
tickLowerint24The lower tick
tickUpperint24The upper tick
tickSpacingint24The tick spacing

Returns

NameTypeDescription
curvestringThe curve path

generateSVGCurveCircle​

Generate the SVG for the circles on the curve

function generateSVGCurveCircle(int8 overRange) internal pure returns (string memory svg);

Parameters

NameTypeDescription
overRangeint80 if the current tick is in range, 1 if the current tick is over range, -1 if the current tick is under range

Returns

NameTypeDescription
svgstringThe SVG for the circles

generateSVGPositionDataAndLocationCurve​

If the position is over or under range, generate one circle at the end of the curve on the side of the range it is on with a larger circle around it If the position is in range, generate two circles at the ends of the curve

Generate the SVG for the position data (token ID, hooks address, min tick, max tick) and the location curve (where your position falls on the curve)

function generateSVGPositionDataAndLocationCurve(string memory tokenId, address hook, int24 tickLower, int24 tickUpper)
    private
    pure
    returns (string memory svg);

Parameters

NameTypeDescription
tokenIdstringThe token ID
hookaddressThe hooks address
tickLowerint24The lower tick
tickUpperint24The upper tick

Returns

NameTypeDescription
svgstringThe SVG for the position data and location curve

substring​

function substring(string memory str, uint256 startIndex, uint256 endIndex) internal pure returns (string memory);

tickToString​

function tickToString(int24 tick) private pure returns (string memory);

rangeLocation​

Get the location of where your position falls on the curve

function rangeLocation(int24 tickLower, int24 tickUpper) internal pure returns (string memory, string memory);

Parameters

NameTypeDescription
tickLowerint24The lower tick
tickUpperint24The upper tick

Returns

NameTypeDescription
<none>stringThe x and y coordinates of the location of the liquidity
<none>string

generateSVGRareSparkle​

Generates the SVG for a rare sparkle if the NFT is rare. Else, returns an empty string

function generateSVGRareSparkle(uint256 tokenId, address hooks) private pure returns (string memory svg);

Parameters

NameTypeDescription
tokenIduint256The token ID
hooksaddressThe hooks address

Returns

NameTypeDescription
svgstringThe SVG for the rare sparkle

isRare​

Determines if an NFT is rare based on the token ID and hooks address

function isRare(uint256 tokenId, address hooks) internal pure returns (bool);

Parameters

NameTypeDescription
tokenIduint256The token ID
hooksaddressThe hooks address

Returns

NameTypeDescription
<none>boolWhether the NFT is rare or not

Structs​

SVGParams​

struct SVGParams {
    string quoteCurrency;
    string baseCurrency;
    address hooks;
    string quoteCurrencySymbol;
    string baseCurrencySymbol;
    string feeTier;
    int24 tickLower;
    int24 tickUpper;
    int24 tickSpacing;
    int8 overRange;
    uint256 tokenId;
    string color0;
    string color1;
    string color2;
    string color3;
    string x1;
    string y1;
    string x2;
    string y2;
    string x3;
    string y3;
}
Helpful?