#HTML
Explore tagged Tumblr posts
definitely-zen-browser · 1 month ago
Text
she <head> on my <body> till i </html>
250 notes · View notes
magnusthemes · 3 days ago
Text
Tumblr media Tumblr media Tumblr media Tumblr media
Theme -  Allfire; [preview] [code] [magnusthemes] [buy me a coffee?]
A compact, versatile and responsive header theme.
Features:
Full support for NPF posts
Theme is responsive!
Like/reblog buttons
1, 2 or 3 columns of posts
Custom post size from 250px to 540px
Pagination options: Infinite scroll, manual load or pagination
Background image options: Full-size, repeated, none
Header image options: Full-size, compact, none
Change content opacity from 0 to 1
Optional rainbow accents
Notes:
Built with JSON - thanks to @eggdesign's base code!
To insert links into the menu, simply create a page and check “show a link to this page”.
Please turn off the default mobile theme in Advanced Options if you want to use the mobile version!
Subtitle is optional, and you can add icons if you want!
Updates tab is also optional, and you can also add icons if you want!
Icons cheatsheet: here
Full list of credits: here
Please like and/or reblog this post if you use or plan or using this theme, and consider buying a coffee to support me! Thank you c:
194 notes · View notes
sesamestreetkid · 10 months ago
Text
!!! my tag system is below all of this,,, I moved it under a cut because people reblog this post for the links :P
edit: thx for the love on this post. im going to try and continually update this!
Tumblr media
⇩ ⠀sites FULL of web graphics ⇩
Tumblr media
blinkie maker : make your own blinkies!
DOLLZ REVIVAL : a revival of pixel dolls where you can create and share your own. very cute!
GlowTxt : create glowing transparent text gifs that say whatever u want
HOARDER'S PILE : contains blinkies, buttons, stamps, and teddies
plasticdino.neocities.org : blinkies
Glitter Graphics : contains gifs, blinkies, dividers, and just sooo many web graphics
Cute Kawaii Resources : contains gifs, blinkies, stamps, favicons, dividers, buttons, fonts, literally everything you need. its an insane resource
Adrian's blinkie collection : collection of blinkies, stamps, and buttons
☆ (supplies.ju.mp) : blinkies, stamps, buttons, & favicons
twigbranch.carrd.co : blinkies
lallys.carrd.co : blinkies, stamps, dividers, and other resources
Bugleeblinkie.carrd.co : blinkies, and 3 very special gifs at the end ;)
unshinesblinkies.carrd.co : blinkies
The 88x31 GIF Collection : buttons. there are 5 parts! huge collection!
Bonnibel's Graphic Collection : blinkies
WELCOME TO GIFCITY : blinkies, dividers, favicons, stamps
cass-tastrophe.carrd.co : blinkies, stamps
kotatsuOS : blinkies
Cute web graphics : blinkies, stamps, dividers, and a LOT of other graphics, all very cute
Tumblr media
⇩ some html tools! + tags below cut ⇩
Tumblr media Tumblr media
MDN (mozilla.org) : if you're just starting out like me this is super helpful HTML Tutorial (w3schools.com): same here! (offers other programming languages as well!) Accessibility Checker(Free Scan) : a site you can use to check accessibility/ADA compliance when making your website! it will point out what needs to be changed. it is free, but they also offer paid services if you need more help imagecolorpicker.com : hex code picker. i use this one because you can upload an image, paste clipboard, OR type in the website and it'll grab a screenshot for you! something simple that was made really well. cssgradient.io : helps you make css gradients for backgrounds or whatever else you need them for smartgb.com : a free guestbook service FC2 Counter! : free "site visits" and "online now" counters. fully customizable Unclosed Tag Checker by Alicia Ramirez : does as it says, checks for unclosed tags (although I recommend using a program that does this as you write anyways. I use Visual Studio Code. Status Cafe : an updateable and embeddable status that you can stick anywhere on your site! it is mostly customizable with CSS but I have noticed a few small quirks with it
my tagging system :))
#graphics
#blinkies
#stamps
#buttons
#dividers
#html/css
#resources
#code
Tumblr media
e10's web (neocities.org) <- shameless site plug. show it some love :P
539 notes · View notes
kitkatcodes · 2 years ago
Text
✧・゚: Customize your highlight color! :・゚✧
Tumblr media
I recently came across a blog where when I went to highlight some text I noticed it was a unique color!!! (」°ロ°)」
AND IT'S SO SIMPLE TO DO
all you do is go to your css file and add this:
::selection { background: <hexcolor> }
Enjoy!! ♡⸜(˶˃ ᵕ ˂˶)⸝♡
2K notes · View notes
vavoom-sorted-art · 12 hours ago
Note
Hellooo
Quick question:
How do you make the text in your posts rainbow? Like literally (with the gradient and everything)?
Thanks for your time, have a nice dayy 🤍
I figured it out from a tutorial that I sadly can't find anymore but here's my process broken down quickly!
I use these two websites to do it: Text colorizer Replace Text
Step 1:
So as a note, you can only do this on the browser version of Tumblr because you need to activate the HTML editing mode. If you're on your phone, you can go to the website and request the desktop view, but it's a bit more finnicky on a phone - so I recommend using a PC for this if you can.
To do that, first click on create post, then go to the settings on your post (the little gear at the top right) and turn on HTML in the Text Editor dropdown menu where it says rich text.
Tumblr media
I like to write out my post first and then switch over to HTML mode.
Step 2:
Then you'll switch to Text Colorizer and type in your text and select your colours. You can choose any colours for your gradients, different modes or a rainbow effect!
Once the preview looks good, go select and copy everything in the bottom field where it says HTML code. Use CTRL+A to make sure you selected everything!
Step 3:
If you paste this in your post, it won't work yet. First, you need to go to Replace Text and remove all the semicolons, so you paste in your copied HTML and type a ; into the field where it says "Replace this:" and leave the Field "With This:" empty.
Tumblr media
Click Replace Text and then Copy to Clipboard.
Step 4:
Now you're ready to paste your rainbow text into your post! If you've already written it out, find the bit you want to colour and replace it with your code, or you can just paste it in.
Once you pasted it, you can click on the "Preview" tab at the top and format your post like normal. Don't return to Rich Text mode, that might break it!
You're done!
Enjoy your rainbow text!
25 notes · View notes
divinector · 6 days ago
Text
Tumblr media
Glowing Text Animation
4 notes · View notes
ano-otoko · 28 days ago
Text
Tumblr media Tumblr media
Yourspace, a modern "Myspace" page template
(Pictured above: the default layout, and my old customised page that I've used prior as an example)
I've been making pages for (formerly) Neocities and my personal site for going on 8 years now, and it turns out that I have a lot of old ass codes that I don't really like or use anymore. So, I've decided to start uploading some of them!
This is "Yourspace", a modern Myspace-based layout code that ditches the horrid table layouts, with bonus compatibility for mobile screens. It's not compatible with old Myspace themes as a result, but should be much easier to customise to make up for it. Intended for Neocities, Nekoweb, etc., it does require basic knowledge of HTML and CSS to use -- since it's older it's not my cleanest work, but should be readable enough that it's (hopefully) not difficult to work with.
☆ Downloads and more info at my site! ☆
179 notes · View notes
liminul · 1 month ago
Text
Tumblr media Tumblr media Tumblr media Tumblr media Tumblr media Tumblr media Tumblr media
som OC buttons for ur sites.... checkem out,,, no kredit necessary...
100 notes · View notes
bogleech · 1 year ago
Text
Going to put all this in its own post too by popular request: here's how you make your own website with no understanding of HTML code at all, no software, no backend, absolutely nothing but a text file and image files! First get website server space of your own, like at NEOCITIES. The free version has enough room to host a whole fan page, your art, a simple comic series, whatever! The link I've provided goes to a silly comic that will tell you how to save the page as an html file and make it into a page for your own site. The bare minimum of all you need to do with it is JUST THIS:
Tumblr media
Change the titles, text, and image url's to whatever you want them to be, upload your image files and the html file together to your free website (or the same subfolder in that website), and now you have a webpage with those pictures on it. That's it!!!!! .....But if you want to change some more super basic things about it, here's additional tips from the same terrible little guy:
Tumblr media Tumblr media Tumblr media Tumblr media Tumblr media Tumblr media
That last code by itself is: <meta HTTP-EQUIV="REFRESH" content="0; url=001.html"> Change "001.html" to wherever you want that link to take people. THIS IS THE REASON WHY when you go to bogleech.com/pokemon/ you are taken instantly to the newest Pokemon review, because the /pokemon/ directory of my website has an "index.html" page with this single line of code. Every pokemon review has its own permanent link, but I change that single line in the index file so it points to the newest page whenever I need it to! While I catered these instructions to updating a webcomic, you can use the same template to make blog type posts, articles or just image galleries. Anything you want! You can delete the navigational links entirely, you can make your site's index.html into a simple list of text links OR fun little image links to your different content, whatever! Your website can be nothing but a big ugly deep fried JPEG of goku with a recipe for potato salad on it, no other content ever, who cares! We did that kind of nonsense all the time in the 1990's and thought it was the pinnacle of comedy!! Maybe it still can be?!?! Or maybe you just want a place to put some artwork and thoughts of yours that doesn't come with the same baggage as big social media? Make a webpage this way and it will look the same in any browser, any operating system for years and years to come, because it's the same kind of basic raw code most of the internet depends upon!
12K notes · View notes
numbpilled-themes · 1 day ago
Text
Tumblr media
verdant ossuary- pastel green bone garden HTML neocities/nekoweb/etc website template code
Tumblr media Tumblr media
DOWNLOAD:
KO-FI // GUMROAD
Tumblr media Tumblr media
8 notes · View notes
catchymemes · 5 months ago
Text
Tumblr media
2K notes · View notes
luxury-poison · 7 months ago
Text
Tumblr media Tumblr media
✦ Uso libre. ✦ No retirar créditos, ni usar como base para otro código. ✦ Si desean preguntar sobre cómo está hecho con mucho gusto los puedo guiar, con una pequeña mención en sus futuros diseños.
✦ Código multiusos, idea original una página de un diario. ✦ Medidas 450 x 550. ✦ Las imágenes se redimensionan. ✦ Para la frase y el título de la foto no exagerar en extensos y texto tienen scroll automático. ✦ Icono de Font Awesome editable.
✦ Tiene cuatro variables:
--accent: Color principal.
--bckgrnd: Color de fondo principal.
--bckgrnd1: Color del borde fotográfico y barra scroll.
--bckgrnd3: Color de fondo de la foto.
✦ Personaje: Elysia | Honkai Impact 3. ✦ Cualquier duda, pregunta, sugerencia estoy a un ask de distancia. ✦ Disponible para crear todas sus ideas y volverás realidad; ¡Comisiones abiertas! ¡Pregúntame!
✦ Si te gusta mi trabajo el like y reblog me ayudan a crecer.
[Code]
@elalmacen-rp
XOX Luxury Poison
34 notes · View notes
pixinerae · 4 months ago
Text
Tumblr media
new website template @ itinerae.
24 notes · View notes
kafus · 3 years ago
Text
beginner’s guide to the indie web
“i miss the old internet” “we’ll never have websites like the ones from the 90s and early 2000s ever again” “i’m tired of social media but there’s nowhere to go”
HOLD ON!
personal websites and indie web development still very much exist! it may be out of the way to access and may not be the default internet experience anymore, but if you want to look and read through someone’s personally crafted site, or even make your own, you can still do it! here’s how:
use NEOCITIES! neocities has a built in search and browse tools to let you discover websites, and most importantly, lets you build your own website from scratch for free! (there are other ways to host websites for free, but neocities is a really good hub for beginners!)
need help getting started with coding your website? sadgrl online has a section on her website dedicated to providing resources for newbie webmasters!
HTML (HyperText Markup Language) and CSS (Cascading Style Sheets) are the core of what all websites are built on. many websites also use JS (JavaScript) to add interactive elements to their pages. w3schools is a useful directory of quick reference for pretty much every HTML/CSS/JS topic you can think of.
there is also this well written and lengthy guide on dragonfly cave that will put you step by step through the basics of HTML/CSS (what webpages are made from), if that’s your sort of thing!
stack overflow is every programmer’s hub for asking questions and getting help, so if you’re struggling with getting something to look how you want or can’t fix a bug, you may be able to get your answer here! you can even ask if no one’s asked the same question before.
websites like codepen and jsfiddle let you test HTML/CSS/JS in your browser as you tinker with small edits and bugfixing.
want to find indie websites outside the scope of neocities? use the search engine marginalia to find results you actually want that google won’t show you!
you can also use directory sites like yesterweb’s link section to find websites in all sorts of places.
if you are going to browse the indie web or make your own website, i also have some more personal tips as a webmaster myself (i am not an expert and i am just a small hobbyist, so take me with a grain of salt!)
if you are making your own site:
get expressive! truly make whatever you want! customize your corner of the internet to your heart’s content! you have left the constrains of social media where every page looks the same. you have no character limit, image limit, or design limit. want to make an entire page or even a whole website dedicated to your one niche interest that no one seems to be into but you? go for it! want to keep a public journal where you can express your thoughts without worry? do it! want to keep an art gallery that looks exactly how you want? heck yeah! you are free now! you will enjoy the indie web so much more if you actually use it for the things you can’t do on websites like twitter, instead of just using it as a carrd bio alternative or a place to dump nostalgic geocities gifs.
don’t overwhelm yourself! if you’ve never worked with HTML/CSS or JS before, it may look really intimidating. start slow, use some guides, and don’t bite off more than you can chew. even if your site doesn’t look how you want quite yet, be proud of your work! you’re learning a skill that most people don’t have or care to have, and that’s pretty cool.
keep a personal copy of your website downloaded to your computer and don’t just edit it on neocities (or your host of choice) and call it a day. if for some reason your host were to ever go down, you would lose all your hard work! and besides, by editing locally and offline, you can use editors like vscode (very robust) or notepad++ (on the simpler side), which have more features and is more intuitive than editing a site in-browser.
you can use ctrl+shift+i on most browsers to inspect the HTML/CSS and other components of the website you’re currently viewing. it’ll even notify you of errors! this is useful for bugfixing your own site if you have a problem, as well as looking at the code of sites you like and learning from it. don’t use this to steal other people’s code! it would be like art theft to just copy/paste an entire website layout. learn, don’t steal.
don’t hotlink images from other sites, unless the resource you’re taking from says it’s okay! it’s common courtesy to download images and host them on your own site instead of linking to someone else’s site to display them. by hotlinking, every time someone views your site, you’re taking up someone else’s bandwidth.
if you want to make your website easily editable in the future (or even for it to have multiple themes), you will find it useful to not use inline CSS (putting CSS in your HTML document, which holds your website’s content) and instead put it in a separate CSS file. this way, you can also use the same theme for multiple pages on your site by simply linking the CSS file to it. if this sounds overwhelming or foreign to you, don’t sweat it, but if you are interested in the difference between inline CSS and using separate stylesheets, w3schools has a useful, quick guide on the subject.
visit other people’s sites sometimes! you may gain new ideas or find links to more cool websites or resources just by browsing.
if you are browsing sites:
if the page you’re viewing has a guestbook or cbox and you enjoyed looking at the site, leave a comment! there is nothing better as a webmaster than for someone to take the time to even just say “love your site” in their guestbook.
that being said, if there’s something on a website you don’t like, simply move on to something else and don’t leave hate comments. this should be self explanatory, but it is really not the norm to start discourse in indie web spaces, and you will likely not even be responded to. it’s not worth it when you could be spending your time on stuff you love somewhere else.
take your time! indie web doesn’t prioritize fast content consumption the way social media does. you’ll get a lot more out of indie websites if you really read what’s in front of you, or take a little while to notice the details in someone’s art gallery instead of just moving on to the next thing. the person who put labor into presenting this information to you would also love to know that someone is truly looking and listening.
explore! by clicking links on a website, it’s easy to go down rabbitholes of more and more websites that you can get lost in for hours.
seeking out fansites or pages for the stuff you love is great and fulfilling, but reading someone’s site about a topic you’ve never even heard of before can be fun, too. i encourage you to branch out and really look for all the indie web has to offer.
i hope this post helps you get started with using and browsing the indie web! feel free to shoot me an ask if you have any questions or want any advice. <3
24K notes · View notes
pneuma-themes · 4 months ago
Text
Tumblr media Tumblr media Tumblr media Tumblr media Tumblr media
Primavera: All in One Page #01 by @pneuma-themes
Always, it's spring, and everyone's in love, and the flowers pick themselves.
Live Preview / Get the code: [Pastebin] / [Github]
Another Twitter inspired layout. This is an all-in-one page with about, blogroll, tags, and FAQ sections. The code has been heavily annotated, so please go through the code first before sending me an ask!
Important note: Your blog must have been given permission to use Javascript on pages. As of 2024, the waiting time is almost indefinite, and thus might necessitate a circumvention. You can refer to the post I linked to find the how-to.
For the blogroll to display the list of blogs you follow, you must enable this option on the blog setting:
Tumblr media
This will not work on secondary blogs, as they do not have that option on their settings.
Features:
Five custom links
Everything is customizable, from the icons to the content and the colors. Customizable options can be found on the :root section of the CSS.
A built-in light-on/off mode that can be toggled by one click.
A header image. The size of your header image is 60% of your screen width x. 250px. The image should resize automatically.
An endless space for practically every section. You can be as detailed or as concise as you like.
Sticky navigation tabs.
A short "currently" tab in the about section, can be about anything you like.
This is a page theme, so blog posts will not be displayed. Please install this through the Add new page link instead.
Credits:
Icons: @alydae
Header: @tofuvi
Fonts: Merriweather, Albert Sans @ bunny.net
Font icons: Dencar Icons (ported by @glenthemes)
CSS tabs: bulma.css, functionality adapted from this StackOverflow post.
Tooltips: tippy.js
Please like and reblog if you like or are using this!
499 notes · View notes