• Loveberry

Further Resources

Some links that may help you further on your webmaking journey! All are organized or semi-organized into a category I think fits them best, feel free to click the buttons below to find what you're looking for!

Please Note: I have many links in here, some links may break and/or not work as files are adjusted through a variety of sites, if you see any broken link please let me know on my Main website and I'll try to either: see where the link is moved to, check the wayback machine for an archived version or remove the link! Thank you



Please Note:

These are all the resources I personally tend to use or enjoy a lot.

https://www.w3schools.com/
Tagged as: Basic | Snippets | June's Favourites

Lots of easy beginner stuff as well as some snippets to help you learn

https://developer.mozilla.org/en-US/
Tagged as: Basic | June's Favourites

A good HTML/CSS/JS reference site

https://stackoverflow.com/tags
Tagged as: Basic | Misc

A place where you can ask questions on how to do things, it's been around for a while so make sure to search for your query first before asking

https://jsfiddle.net/
Tagged as: Programs

Like Codepen (online code editor) but you don't need an account

https://css-tricks.com/snippets/css/a-guide-to-flexbox/
Tagged as: Basic | Snippets | June's Favourites

Easy and quick sheet giving a quick rundown of flexbox related things

https://websitesetup.org/css3-cheat-sheet/
Tagged as: Basic

A huge CSS cheat sheet

https://boxshadows.xyz/
Tagged as: Generator

A box shadow generator

http://owumaro.github.io/text-stroke-generator/
Tagged as: Generator | June's Favourites

A text stroke generator using text shadow

https://www.shecodes.io/css_generators/css-transform-generator
Tagged as: Generator

A CSS transformations generator

https://www.useragentman.com/matrix/
Tagged as: Generator

A CSS matrix (3d) generator

https://juneish.neocities.org/written/resources/?page=span-ify
Tagged as: Generator | June's Favourites

A generator that puts <span> tags around each letter of a word you've put in, super helpful for stuff like tumblr wobble and princess text

https://9elements.github.io/fancy-border-radius/full-control
Tagged as: Generator | June's Favourites

A border radius generator that gives you control over 8 points, makes it easier to create unique shapes

https://bennettfeely.com/clippy/
Tagged as: Generator

A CSS clip-path maker

https://cssgradient.io/
Tagged as: Generator

A CSS gradient maker

https://www.lipsum.com/
Tagged as: Generator

Generates a bunch of lorem ipsum text based on how many paragraphs of it you want, great for placeholder stuff

https://www.stuffbydavid.com/textcolorizer
Tagged as: Generator

BBCode and HTML text colouriser, creates text gradients by wrapping each letter in a <span> styled in the order of a gradient

https://neumorphism.io/
Tagged as: Generator

Allows you to create elements in a neumorphism style

https://kovart.github.io/dashed-border-generator/
Tagged as: Generator

Allows you to create custom dashed and dotted borders

https://goblin-heart.net/sadgrl/projects/layout-builder/
Tagged as: Template

Sadgrl's layout builder

https://petrapixel.neocities.org/coding/layout-generator
Tagged as: Generator | Template | June's Favourites

Petrapixel's layout generator, is more accessible than Sadgrl's and has more options

https://templaterr.neocities.org/
Tagged as: Template

Neocities Layouts

https://eggramen.neocities.org/code/css_testpages
Tagged as: Template

Eggramen's layouts

https://limegreen.neocities.org/templates/wikitable/wikitable
Tagged as: Template

A layout mimicing wiki sites like fandom

https://websetsbylynn.neocities.org/
Tagged as: Generator | Graphics

Websets by Lynn, featuring graphics, glitter text generators and an 88 x 31 button maker

https://zonelets.net/
Tagged as: Template | Snippets

Helps you set up a blog for your site, has some themes you can choose from

https://rarebit.neocities.org/
Tagged as: Template

Helps you set up a template for your comic

https://virtualobserver.moe/ayano/comment-widget
Tagged as: Snippets | June's Favourites

Lets you add comment sections on your website

https://frills.dev/blog/231023-add-moderation-to-comment-widget/
Tagged as: Snippets | June's Favourites

Frills' moderation add-on for ayano's comment widget

https://layercake.nekoweb.org/writing/articles/admin
Tagged as: Snippets | June's Favourites

My Admin Mark add-onn for ayano's comment widget

https://www.dafont.com/
Tagged as: Fonts

A font collection database

https://fonts.google.com/
Tagged as: Fonts

Google fonts

https://archive.org/download/Fontworks/
Tagged as: Fonts

An archived collection of fontworks fonts

https://fontcity.neocities.org/
Tagged as: Fonts

Some fonts hosted on neocities

https://www.tumblr.com/tamapalace/752923986362548225/the-iconic-tamagotchi-connection-font-is-now
Tagged as: Fonts

The Tamagotchi Connections font

https://www.tumblr.com/gayocto-rey/712271192135008256/official-splatoon-fonts-complete-with-kanji
Tagged as: Fonts

Splattoon 1 and Splattoon 2 fonts

https://blinkies.cafe/
Tagged as: Generator | Graphics

Generate your own blinkies

https://gifcities.org/
Tagged as: Graphics

Animated gifs from geocities

https://99gifshop.neocities.org/
Tagged as: Graphics

A gif collection

https://www.deadlinkchecker.com/website-dead-link-checker.asp
Tagged as: Accessibility | Misc

Checks your site for dead links

https://www.browserling.com/tools/text-replace
Tagged as: Misc | June's Favourites

A text replacer

https://meyerweb.com/eric/tools/color-blend/#:::hex
Tagged as: Misc

Blend two colours together

https://www.spriters-resource.com/
Tagged as: Graphics | June's Favourites

Sprite rips from a wide variety of games

http://embedresponsively.com/
Tagged as: Misc | Accessibility

Embeds iframes in a responsive manner

https://www.webdesignmuseum.org/
Tagged as: Misc | June's Favourites

A museum of web design, great for inspiration

https://layouts.spacehey.com/layout?id=85996#/
Tagged as: Snippets

A working coded Nintendo Ds

https://gifypet.neocities.org/
Tagged as: Snippets

A pet for your website

https://tamanotchi.world/
Tagged as: Snippets

Like a tamagotchi but NOT! can have them chill on your site

https://webneko.net/
Tagged as: Snippets

Code for a cat that can follow your cursor

https://www.imood.com/
Tagged as: Snippets

Share your mood with the world

https://status.cafe/
Tagged as: Snippets | June's Favourites

Share a status with the world

https://social.nekoweb.org/
Tagged as: Snippets

A nekoweb social page, similar in manner to status.cafe

https://pollcode.com/
Tagged as: Snippets

Allows you to add a poll to your website

https://khang-nd.github.io/7.css/
Tagged as: Libraries

CSS framework recreating Windows 7

https://botoxparty.github.io/XP.css/
Tagged as: Libraries

CSS Framework recreating Windows XP

https://jdan.github.io/98.css/
Tagged as: Libraries

CSS Framework recreating Windows 98

https://sakofchit.github.io/system.css/
Tagged as: Libraries

CSS Framework based on System 6 of Apples OS system

https://michalsnik.github.io/aos/
Tagged as: Libraries

Allows things to be animated as you scroll down

https://code.visualstudio.com/
Tagged as: Programs

A code editor

https://vscodium.com/
Tagged as: Programs | June's Favourites

A code editor

https://brackets.io/
Tagged as: Programs

A code editor

https://www.gameuidatabase.com/
Tagged as: Misc

A database of game UI's, good for inspiration

https://piclog.blue/
Tagged as: Misc | June's Favourites

Share (heavily compressed) pictures with your friends

https://validator.w3.org/
Tagged as: Basic | Accessibility | June's Favourites

A HTML validator

https://www.dragonflycave.com/free-quiz-scripts
Tagged as: Snippets

Scripts to make a quiz on your website

https://fonts.google.com/icons
Tagged as: Libraries

Googles material icons

https://lucide.dev/
Tagged as: Libraries | June's Favourites

Lucide icons

https://contrast-triangle.com/
Tagged as: Basic | Accessibility | Misc | June's Favourites

An accessibility resource that makes sure you have enough contrast between the background, link text and normal text if you're removing the underline from the link

https://www.w3schools.com/css/css_templates.asp
Tagged as: Template

W3Schools responsive templates

https://www.beepbird.net/freebies/site-templates/website-templates.html
Tagged as: Template

Beepbird's responsive templates

https://kalechips.net/projects/snippets
Tagged as: Snippets

Kalechips code snippets

https://kalechips.net/projects/layouts/
Tagged as: Template

Kalechips responsive layouts

https://kalechips.net/projects/code/
Tagged as: Snippets | Misc

Kalechips coding projects, including: a fake but accessible listography clone (with added features), a gallery genertator as well as some PHP snippets

https://punkwasp.neocities.org/creations/templates/
Tagged as: Template

Punkwasp's templates

https://animate.style/
Tagged as: Libraries

A library of css animations

https://cupcakeipsum.com/
Tagged as: Generator | Misc

A lorem ipsum generator but focused around cake

https://highlightjs.org/
Tagged as: Libraries | June's Favourites

A library which styles syntax within code blocks to be highlighted, used on the code blocks in the resources page of this website

https://wave.webaim.org/
Tagged as: Basic | Accessibility |

A website which evaluates your code for accessibility errors

https://nownownow.com/about
Tagged as: Misc

A website which lists everyone with a 'now' page, a concept which says what a person is focused on at that part of their life.

https://fontstruct.com/fontstructions/show/2611132/fields-of-mistria
Tagged as: Fonts

Fields of Mistria font.

https://drawbox.nekoweb.org/
Tagged as: Snippets

Allows you to add a canvas drawing area, where people can draw images and submit them to you.

https://devdocs.io/
Tagged as: Basic

API documentaton for any language / framework. You can use the search section for what you're looking for, and download it offline.

https://bohemiansultriness.nekoweb.org/goodies/keepittidy.txt
Tagged as: Snippets

An add-on to drawbox that adds moderation

https://fontjoy.com/
Tagged as: Fonts

A website that helps you with pairing fonts

https://www.freefaces.gallery/
Tagged as: Fonts

A gallery that curates fonts that are under some kind of free license

https://palitra.app
Tagged as: Misc

Search a brand, and it will give you colour palettes based on that search term

https://randoma11y.com/
Tagged as: Accessibility | Generator | Misc

A website that generates random accessible colour combinations that meet contrast guidelines.

https://fontshare.com/
Tagged as: Fonts

A font website where all fonts are free for commercial and personal use

https://dirtylinestudio.com/freebies/
Tagged as: Fonts

Free fonts from dirtylinestudio

https://uncut.wtf/
Tagged as: Fonts

Another font related website

https://home.streamlinehq.com/
Tagged as: Libraries

The 'ultimate icon library', having lists of many other icon libraries within the website

https://coolshap.es/
Tagged as: Misc

A website with cool abstract shapes you can download and use

https://land-book.com/
Tagged as: Misc

A web design inspiration website

https://www.awwwards.com/
Tagged as: Misc

A web design inspiration website

https://notepad-plus-plus.org/
Tagged as: Programs

A code editor

https://pixeliana.neocities.org/statuscafe
Tagged as: Snippets | Misc

A quick guide to styling your status cafe page.

https://www.write-on.org/html/builder.html
Tagged as: Template

A layout builder.

https://toggles.dev/
Tagged as: Snippets

A collection of css toggles, to switch between light and dark mode.

https://kushagra.dev/lab/hint/
Tagged as: Libraries

A css tooltp library.

https://cssanimation.io/
Tagged as: Libraries

A css animation library

https://www.lightgalleryjs.com/
Tagged as: Libraries

A javascript lightbox image and video library

https://11ty.rocks/posts/create-your-first-basic-11ty-website/
Tagged as: Misc | June's Favourites

A guide to set up your first basic 11ty website, I personally used this to get started and it helped me a lot

https://webcode.tools/
Tagged as: Generator

Has a bunch of different generators, from stuff like meta tags too helping with border stuff

https://slashpages.net/
Tagged as: Misc

A list of 'slash pages' that you can add to your website, such as /now and /chipotle

https://solaria.neocities.org/accessibility
Tagged as: Accessibility

Solaria's guide to web accessibility

https://www.w3.org/TR/WCAG22/
Tagged as: Accessibility

WCAG 2.2 web accessibility standards

https://www.w3.org/WAI/WCAG22/quickref/
Tagged as: Accessibility

WCAG 2.2 web accessibility quick reference

https://www.w3.org/WAI/WCAG22/Understanding/
Tagged as: Accessibility

WCAG 2.2 web accessibility understanding the documentaton with explanations of the WCAG guidelines and success criteria

https://support.freedomscientific.com/Downloads/JAWS
Tagged as: Accessibility

One of the most popular screenreader softwares

https://www.nvaccess.org/download/
Tagged as: Accessibility

The other one of the most popular screenreader softwares, I used this one to test my main website.

https://trace.umd.edu/peat/
Tagged as: Accessibility

Photosensitivity analysis tool.

https://poet.diagramcenter.org/how.html
Tagged as: Accessibility

Training for how too write good alt text.