Hexooor - Generate hexagonal Twitter NFT profile pictures client-side using HTML5 canvas

Nathan H. Leung

Last update: Dec 20, 2022

Related tags

Image Processing hexooor

Overview

Hexooor

Generate hexagonal Twitter NFT profile pictures client-side using HTML5 canvas.

Demo

https://hexooor.vercel.app/

Getting Started

First, run the development server:

npm run dev
# or
yarn dev

Open http://localhost:3000 with your browser to see the result.

You can start editing the page by modifying pages/index.tsx. The page auto-updates as you edit the file.

API routes can be accessed on http://localhost:3000/api/hello. This endpoint can be edited in pages/api/hello.ts.

The pages/api directory is mapped to /api/*. Files in this directory are treated as API routes instead of React pages.

Learn More

To learn more about Next.js, take a look at the following resources:

Next.js Documentation - learn about Next.js features and API.
Learn Next.js - an interactive Next.js tutorial.

You can check out the Next.js GitHub repository - your feedback and contributions are welcome!

Deploy on Vercel

The easiest way to deploy your Next.js app is to use the Vercel Platform from the creators of Next.js.

Check out our Next.js deployment documentation for more details.

Comments

Smart contract integration

would be kidna lit to integrate this with an actual smart contract that deploys clones of a super minimal ERC721 impl 1/1 for ppl so they can use as a pfp would be a great way to learn solidity and get deeper in the stack

ty @transmissions11!

opened by nathanhleung 1

Fullstack Dynamic NFT Mini Game built using 💎 Diamond Standard [EIP 2535] 🏃‍♀️Players can use Hero NFT to battle against Thanos ⚔ Heroes can be Healed by staking their NFT 🛡

💎 Fullstack Dynamic NFT Mini Game 🎮 💎 Using Diamond Standard Play On 💎 🎮 ⏩ http://diamond-dapp.vercel.app/ Project Description 📝 Fullstack Dynam

Dec 23, 2022

📸 Generate image using HTML5 canvas and SVG

egami → image README | 中文文档 Generate image using HTML5 canvas and SVG Fork from html-to-image Installation pnpm pnpm add egami npm npm i egami Usage i

Jan 3, 2023

Highly opinionated project template for Serverless Framework that follows and applies hexagonal architecture principle to serverless world. Prepared with easy testing in mind.

serverless-hexagonal-template Highly opinionated project template for Serverless Framework that applies hexagonal architecture principles to the serve

Dec 26, 2022

Implementing hexagonal architecture on AWS Lambda with Node.js

Developing evolutionary architecture with AWS Lambda Context Agility enables you to evolve a workload quickly, adding new features, or introducing new

Dec 20, 2022

Generate prime numbers from pictures!

Pictoprime This is a program used to generate prime numbers from pictures. Dependencies Ensure you have the following dependencies: Node.js (16+ suppo

Dec 27, 2022

Fuck Twitter NFTs - Userscript to delete or block all occurances of NFT Users on Twitter

FuckTwitterNFTs Fuck Twitter NFTs - Userscript to delete or block all occurances of NFT Users on Twitter Userscript will by default, attempt to delete

Jan 20, 2022

🎨 Beautify your github profile with this amazing tool, creating the readme your way in a simple and fast way 🚀 The best profile readme generator you will find ⚡

Demo Profile Readme Generator The best profile readme generator you will find! About | Technologies | Requirements | Starting | Contributing 🎯 About

Jan 1, 2023

This site compares your GitHub Profile to your friends, and analyses and tells your GitHub profile score too.

GitHub ⚔️ Duel Deployed at 🚀 : https://githubduel.vercel.app/ Compare your GitHub profiles with your friends It gives score to GitHub profile based o

Nov 21, 2022

A public board for all the Computer Society and Students to display their profile. An online year-book for you to display your profile in the most creative manner

Student's Yearbook by IEEE Computer Society Student's yearbook is an open-source project which intends to dispaly the students who will be graduating

Dec 18, 2022

🐲 Epic NFTs [UI] - Proyecto que te permitirá conectar tu billetera y acuñar un NFT, podrás revender el NFT en OpenSea. El NFT en sí se puede personalizar

🐲 Epic NFTs [UI] El proyecto se encuentra deployado en Vercel para que puedan verlo e interactuar con él, toda crítica o comentario se agradece, pued

Oct 22, 2022

NFT Marketplace framework to build standalone NFT marketplace or inApp/inGame NFT marketplace

NFT Marketplace This project is a decentalized NFT Marketplace framework which is to be the baseline for you to build standalone NFT marketplace or in

Dec 19, 2022

Open source rich text editor based on HTML5 and the progressive-enhancement approach. Uses a sophisticated security concept and aims to generate fully valid HTML5 markup by preventing unmaintainable tag soups and inline styles.

This project isn’t maintained anymore Please check out this fork. wysihtml5 0.3.0 wysihtml5 is an open source rich text editor based on HTML5 technolo

Jan 7, 2023

Dec 30, 2022

Fast and minimal JS head server-side writer and client-side manager.

unihead Fast and minimal JS head server-side writer and client-side manager. Nearly every SSR framework out there relies on server-side components t

Sep 4, 2022

Easy server-side and client-side validation for FormData, URLSearchParams and JSON data in your Fresh app 🍋

Fresh Validation 🍋 Easily validate FormData, URLSearchParams and JSON data in your Fresh app server-side or client-side! Validation Fresh Validat

WebVM is a server-less virtual Linux environment running fully client-side in HTML5/WebAssembly.

WebVM This repository hosts the source code of the https://webvm.io live demo page. WebVM is a server-less virtual Linux environment running fully cli

Jan 8, 2023

p5.js is a client-side JS platform that empowers artists, designers, students, and anyone to learn to code and express themselves creatively on the web. It is based on the core principles of Processing. http://twitter.com/p5xjs —

p5.js Welcome! 👋 👋🏿👋🏽👋🏻👋🏾👋🏼 p5.js is a JavaScript library for creative coding, with a focus on making coding accessible and inclusive for a

React + Canvas = Love. JavaScript library for drawing complex canvas graphics using React.

React Konva React Konva is a JavaScript library for drawing complex canvas graphics using React. It provides declarative and reactive bindings to the

Jan 9, 2023

A vanilla javascript library to generate Avataaars on the client or server side!

Use the awesome Avataaars Library by Pablo Stanley (avataaars.com) in any javascript application. This Project uses parts of the Dicebear Avatars Libr

Dec 4, 2022

Hexooor - Generate hexagonal Twitter NFT profile pictures client-side using HTML5 canvas

Related tags

Overview

Hexooor

Demo

Getting Started

Learn More

Deploy on Vercel

You might also like...

Comments

Owner

Nathan H. Leung

HTML5 CSS3 vanilla js QR code generator with download options

Picdit - Photo Editor is a web application created using HTML, CSS, PHP and JavaScript

Responsive, interactive and more accessible HTML5 canvas elements. Scrawl-canvas is a JavaScript library designed to make using the HTML5 canvas element a bit easier, and a bit more fun!

HTML5 Canvas Gauge. Tiny implementation of highly configurable gauge using pure JavaScript and HTML5 canvas. No dependencies. Suitable for IoT devices because of minimum code base.

Yet another library for generating NFT artwork, uploading NFT assets and metadata to IPFS, deploying NFT smart contracts, and minting NFT collections

Javascript Canvas Library, SVG-to-Canvas (& canvas-to-SVG) Parser

Javascript Canvas Library, SVG-to-Canvas (& canvas-to-SVG) Parser

Twitter-client - client for twitter-clone

Konva.js is an HTML5 Canvas JavaScript framework that extends the 2d context by enabling canvas interactivity for desktop and mobile applications.

NFTKastle is an NFT marketplace where users can mint their pictures as NFTs, list their NFTs for sale, and buy NFTs from other users.