links

personal favs

HTML cheat sheet - SUPER useful and they also have cheatsheets for css and js!

HTML semantics

CSS selectors

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

coolsymbol.com - copy paste symbols ♡ ✉

textemoji.org - copy paste emoticons ໒(⊙ᴗ⊙)७✎▤

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

time stamp generator / HTML entity encoder - use this for my RSS feed!

12ft.io - let's you read paywalled articles and view things without pop-ups or ads

more resource pages:

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!

lexiqqq's hosting - 500mb storage. also 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

misc

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.

oh my posh - customize your terminal of choice

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.

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 help

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)

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

javascriptkit

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!

CSS

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

HTML

www.html.am - html text editor

HTML validator

HTML symbol codes

HTML templates

templates made by me! / neothemes / windchime / francelalune / templaterr / REPTH / teppy / cinni / celestial.zanarkand / nenrikido / itinerae / pomelo / john doe

useful sites

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!)

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

eleventy guide for blogging

cool stuff to put on 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

eleventy - a static site generator! here's a tutorial by whiona on how to get started!

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

music player - can have more than 1 song, toggle time, skip buttons. made by puella / adilene

webamp - music player / sadness' tutorial on codepen

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!

cutercounter.com - another counter service!

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

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

sites with F2U materials

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

cocorini.com/patterns - a nice selection of pastel patterned bgs!

melon's TextureTown - textures

collections

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

tumblr pixel masterposts: music pixels, music pixels 2, cat emoticons, cat emojis, cat pixels emojis, cat emoticons 2, tenshiikisu's bg masterpost

tumblr divider masterposts: 1, 2, 3, 4(rainbow), 5(rainbow), 6

fonts

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

fonts i've used can be found on this page!

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!

dither me this - i use this a lot for my bgs!

dithermark - another site you can dither imgs

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 banner generator

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

the missing semester of your CS education - a series of lectures about rarely covered topics in computer science classes such as proficency with the tools you'll be using.

personal web map - a bunch of links related to the personal web