links
personal favs
- HTML cheat sheet - SUPER useful and they also have cheatsheets for css and js!
- catipsum - lorem ipsum but cats
- generator.lorem-ipsum - lorem ipsum in other scripts! mostly use it for japanese and korean
- catbox.moe - file sharing site
- coolors - lets you make color palettes from scratch or from a pic. you can also save their URL or PNG
- remove.bg - aka make imgs transparent!
- dither me this and ditherit - dither imgs! i use this A LOT. mostly for backgrounds
- w3schools' color picker - shows you the different hues, contrast, and how the color looks as a background with text!
- emmet cheat sheet - type HTML tags faster!
- time stamp generator / HTML entity encoder - for RSS feed!
- coding cheatsheet by petra
resource bookmarks:
- faegardens333 / hekate / nekonokuni / sadgrl.online
- gifcity / ishiimori / XYZ / codesies
- more sites with resources can be found on my button wall
coding & webdev
linking stuff that has helped me on my web coding journey! do remember that practice is key!
code editors
- codepen - online editor with a live preview, lets you save + share codes with an acc. you can see mine here!
- notepad++ - offline editor, like notepad but with more stuff!
- brackets - offline editor, centered around coding HTML, has extensions support! has an online version as well. this is the one i use!
- visual studio code - offline editor, supported by microsoft, it has a TON of extensions and other options in comparison to brackets.
hosting
the descriptions are all from their free plans.
- neocities - 1gb storage. has a social feed.
- ichi.city - 10mb storage. host a small site! have fun!
- nekoweb - 500mb storage. has a social interface similar to neocities!
- github - 1gb storage. make a repository named (YOURUSERNAME).github.io or use any other repository and enable github pages. add a custom domain.
- cloudflare pages - up to 20,000 files of storage. add a custom domain. files have a limit of 25mb each.
- leprd.space - free hosting for hobbyists websites, supports PHP and MySQL
git / github
- git - a version control system, The Thing that tracks your coding history and does other neat stuff! highly recommend learning how to use it because it is super handy for coding.
some guides/tutorials that have helped me: scarecat's, petrapixel's. i also use git bash as my main terminal. - learn git branching
- ohshitgit - solutions to common git mistakes / problems
- deploy-to-neocities - update your neocities directly from your PC (without the neocities editor) using github actions. a crazy time saver and i really recommend it to everyone who updates their site a lot! here's a tutorial by MissMoss on how to install it.
misc
- checklist.design - more in the professional / marketting side of things but it's a website with checklists of what to have on a site.
- roadmap.sh - developer roadmaps! they have one for frontend and backend!
- electron - build desktop apps with html / css / js
- oh my posh - customize your terminal of choice, i use currently use this for mine!
- how to make neocities a billion times more tolerable - a guide on how to use the neocities CLI, with or without github!
HTML, CSS, JS
in my personal experience, i actually learned the basics of HTML and CSS through using and experimenting with templates! but these sites are of huge help as well.
beginner stuff (HTML and CSS focused)
- web.dev's html and css courses! they also have other courses and they explain stuff very simply so i highly recommend this site + it has some more modern concepts compared to w3schools (no shade though)
- w3schools - super beginner friendly that shows you the basics of webpages with demos.
- developer.mozilla.org - info and references for things used in HTML, CSS, and JS. if you don't know what something does, go here and find out!!
- htmldog - simple and straight forward tutorials and info for HTML, CSS, and JS. they have tutorials for beginners as well as more advanced ones!
- interneting is hard - beginner friendly web dev tutorials!
- web zine 01 - zine about making a website from scratch!
javascript
- mozilla's learn javascript
- javascript.info
- simple interactivity with jQuery
- a smarter way to learn JS (PDF book)
- freecodecamp - courses and projects for you to learn responsive web design, basic javascript, and much more!
- the odin project
- RV's free JS effects for your site! includes text, cursor, and screen effects!
- JS compressor - compresses file sizes!
- clipboard.js
CSS
- specificity calculator
- w3schools CSS reference
- CSS patterns
- animated gradient bg generator
- text stroke generator
- CSS compressor - compresses file sizes!
- hover.css - a collection of neat CSS :hover snippets!
- CSS box shadow generator
- cssgradient.io - gradient bgs CSS generator
- clippy - CSS clip-path maker
- CSS triangle generator
- W3Schools cursor property - all the cursors you can use with CSS!
- custom scrollbar maker
- css-tricks.com
- cssgridgarden - learn about css grids
- :nth tester
- webTUI
- grid by examples
HTML
- breezyscoolsite - in-depth guide about making websites
- HTML semantics
- www.html.am - html text editor
- HTML validator
- HTML symbol codes and entities
HTML templates
templates made by me! / neothemes / windchime / francelalune / templaterr / REPTH / teppy / cinni / celestial.zanarkand / nenrikido / itinerae / pomelo / john doeuseful sites for webdev
- can i use... - neat site where you can input a CSS or HTML feature and it outputs its compatibility with all browsers
- web accessibility evaluation tools
- ready.mobi - check how your site looks on mobile
- codebeautify.org - makes your code pretty. you can also minimize your code as well
- px-to-rem converter
- pixelsconverter - converts px to rem, em, inches, and more!
- xml-sitemaps - creates a sitemap of your site!
- viewportsizer - tells you your browser's screen size!
- website speed tester - tells you how fast does your website loads! very neat bc it also tells you which file types are taking most of the space in the page
- cursor.cc - turn PNGs into cursors and also edit them!
- convert UTF8 to HTML entities (another encoder!)
eleventy / 11ty
a static site generator of my choice! i built desteny.me with it.
- eleventy - a static site generator! here's a tutorial by whiona on how to get started!
- eleventy guide for blogging
- search on eleventy
tutorials / guides
- my guides & tutorials can be found here!
- flexbox: solaria's simple gallery guide / sadgrl's flexbox guide
- border imgs: solaria's custom CSS border imgs
- status.cafe feed reader!
- solaria's accessibility article
- solaria's pause gif without JS
- how to switch between different stylesheets
- what is REM in CSS? - an article explaining how this size works
- dokode.moe's blog with tutorials
- encode your email address
cool stuff 4 your site
guestbooks / comments / forms
- FC2 webclap button for your site! also lets people comment on the clap page.
- comment widget by ayano
- chattable - free and extremely customizable chatbox by xobyte.dev
- atabook - a 123guestbook replacement by dimden!
- cbox - chatbox
- formsubmit - submits HTML forms to your e-mail with no JS needed
- bravenet contact forms - embed forms into your site!
tools
- sheet sites - from google sheets to HTML
- 22ru's microblog - template. uses a XML file to update your microblogs!
- neoblogtool - a blogging tool with a tagging system and a WYSIWYG editor.
- melon's gallery maker - micro static site generator that let's you share pics into your website easily!
- publii - content manager for your static site! very easy to use and set up
- glightbox - gallery tool with lots of options!
- zonelets - a static blogging tool
calendars / clocks
- calendar.sakura.ne - pastel colors japanese calendar
- timeanddate.com clock - customize it with your timezone
- customizable JS calendar
- timeanddate.com countdown timer
music
- last fm live feed
- last fm last played widget
- webamp - music player / sadness' tutorial on codepen
- goooby's music player
RSS
- RSS feed widget
- RSS 2 HTML - another great rss widget
- feed canary - e-mails you if your RSS ever goes bad!
misc
- project ideas for your site! by sadgrl.online
- FC2 hits & online counter - keeps track of how many people have looked at your site!
- cursors4u - huge library of cursors
- poll code - make a poll for your website!
- moon widget by dimden.dev
- another moon widget
- webneko - have an interactive cat on your page!
- accessibility widget - an easy instillation widget that gives your site pages accessibility
neat codes
- sidebar the same across all pages (w/ js) by templaterr
- JS style switcher
- falling items code by sadness
- multiple modals on a single page
- image grid w/ options
- responsive img grid
- mask-image property
- CSS tooltip
- JS tooltip - i use this one throughout my site!
- toggle a div's class on click with a button
- filter tags with buttons
- pixel jar and gameboy scrollboxes by appledust
- crt display css code - make ur site have a crt effect
- changing gradient bg css
- font shake CSS code
- save textarea as txt file
- CRT TV effect
- scrolling title tag
- tippy.js - another JS tooltip!
- site closer script by melonking
graphics
my graphic collection page
sites with F2U materials
- phosphoricons - icons
- kawaiiscans - scans of cute notepads
- foollovers.com - site with pixels, bgs, dividers, templates, etc
- mothclub's pixels!
- cute.lolipop.jp - cute pixel materials
- sozaiya 405 - a lot of bear themed cute materials!
- sleepysprout - pixels, adopts
- zozai.pooftie - site with transparent deco pngs, pattern bgs, lace dividers, etc
- fancyparts - cute bgs, and web materials
- sozaioukoku - site with cute bgs
- solaria's border imgs
- loves1ck sozai page!
- marsha's graphic garden
- halloween materials by hillhouse
- nya.rose cute pixel icons and wallpapers
backgrounds
- tartan maker - plaid pattern generator, v useful if u want a tiled bg
- backgroundsarchive - old low quality bgs!
- pexels - free bgs / textures
- unsplash - free bgs / textures
- sadgrl.online tiled bgs
- patternico - lets you create tiled bgs!
- transparent textures
- melon's TextureTown - textures
collections
- wioryz - pixels
- gifcities.org - hosted by internet archive, gifs
- cyber.dabamos.de - buttons from the 90's and 2000's
- homuhoard - favicons, pixels, stamps, etc.
- bonnibel's graphic collection - big pixels, containers, dividers
- pixels.crd.co - favicons
- finn's resources - favicons
- pixelsafari - favicons, stamps, blinkies, etc.
- nyaa's stickebook - graphic resources archive + links
- betty's graphics - gifs
- favicons - big pixels, stamps, etc.
- sadthemes' pixel collection - favicons
tumblr blogs with graphic collections
- purinpixel - pixels, bgs, tags available
- fruchtgummi - favicons, tags available
- lostsozai - pixels of all sizes, dividers, gifs
- pixel-soup - pixels of all sizes, bits of codes, tags available
- cutewebgraphics - bgs, pixels, blinkies. tags available
misc
image editing
- hekate2' button maker - a 88x31 button maker
- 80x15 web badge maker
- photopea photoshop but FREE and in your browser. might be slow. might also blow up your computer.
- bulkresizephotos - has lots of options on how you want to edit the pics!
- picresize - online pic editor/resizer + also has the option to do it by bulk!
- convertio.co - let's you convert files. sadly it has a limit to how many files you can convert daily...
- xnconvert - bulk img converter software
- caesium image compressor - online img compressor but it also offers an offline software you can download!
- pixel art editor - online / offline
- libresprite - a free and open source fork of aseprite
- fanlisting button generator
- fromsoft image macro creator
dithering
fonts
fonts i've used can be found on this page!
- dafont - website with tons of free to use fonts!
- pentacom's bitfonts
- other site's font pages! cinni's / scripted's / strawberry-gashe's / solaria's
copy-paste sites
- emojidb - a database of emojis, people submit cool combinations of symbols and emoticons and you can search for them via keywords!
- coolsymbol.com - copy paste symbols ♡ ✉
- textemoji.org - copy paste emoticons ໒(⊙ᴗ⊙)७✎▤
misc resources
- digital wellbeing - a collection of links to enhance your digital privacy
- deadlinkchecker - check dead links on entire website or specific page!
- dr. link checker - another dead link checker
- backlink checker - checks for sites that have linked you back!
- calendar-muryou - site about making japanese calendars! it has lots of options
- y2mate.com - youtube MP4 or MP3 downloader
- deepl.com - most accurate translator you'll get. mostly use it for japanese
- tally.so - create free forms
- discord timestamp generator
- webmention.io
- tld-list - compare domain prices
- youtube downloader
firefox add-ons
- force reader view
- feedbro - an RSS reader!
for fun
- my button wall full of sites i like :3 check em out!
- cat therapy - shows you a random pic of a cat every 4 secs
- windows93.net - an old windows mock-up
- (we)bsite - make a letter to the internet
- web design museum - shows you various web designs throughout time!
- wiby.me - search engine that only indexes sites without JS
- the old net - navigate the internet during different years
- ihavenotv - a website that links you documentaries to watch.
- remoji - make lines with emojis with your cursor
communities
- discourse.32bit.cafe - a nice forum of website hobbyists and professionals
- sundaysites.cafe - hosts sessions where you create an HTML page with a given topic and can interact with others afterwards!
wikis
I HATE FANDOM ALL MY HOMIES HATE FANDOM
drag n drop web builders
music
games
- balatrodle
- vibes.fish
- bitsy - game editor for HTML
- tic80 - tiny computer for making games
- roms subreddit
- melon DS - DS emulator
- LCD, Please - papers, please demake made by the same dev!
- 3ds.hacks.guide / things to do / DS game forwarder
- wiiu.hacks.guide / another guide / vwii modding
reading
articles
- say no to web3
- smiley :) lore
- why japanese web design is so different
- how to watch a movie
- against an increasingly user-hostile web
- web3 is a scam, not a revolution
- let Puerto Rico be free
- how websites die
- we're not prepared for the eventual fall of neocities
- on mobile phones, the small web, and able-bodied privilege
- web publishing for yourself
- make the indie web easier
videos
things for your site to join!
directories
- pixel revival - archive of old pixel cliques
- fanlisting.org - a directory of fanlists!
- PROJECT CLIQUE - a directory of cliques
pixel cliques
- kitty friends pixel club
- CD WoRLD - pixel art clique for music lovers
- hall of rock - a pixel guitar clique!
- charm bracelets pixel club
- afternoon tea
- kindness rocks pixel project
- RPG club
webrings
other
- cliqued! - collection of text cliques
- webgardens