r/HTML 5h ago

Question Best service for hosting private HTML app with JSON backup. Firebase or something else?

6 Upvotes

I built a custom HTML app through Claude that is for personal use only. Imagine the equivalent to a to-do-list app. I want to be able to sync the app between my Mac and my iPhone. I understand there is some sandboxing in iOS/Safari that makes this a bit tricky.

What is the best set up for someone with very little technical knowledge that wants near-auto sync between the Mac and iPhone?

What I've been told but can't confirm:

- Scriptable would be a great app to use for this on iOS but buggy on Mac.

- GitHub is an option. Requires API/personal token.

- Firebase would be the easiest as long as you use the authenticator tools so that the web URL is not public (i.e., you have to sign in through your gmail account to get access). Also need to add some coding to ensure it's not scraped by search engines.

- I could store the app in Claude as an artifact but do not trust AI providers yet with my personal data.

Is Firebase the best option? If so, is my data actually not public if the set up is done properly? If someone went to the URL, I assume it would prompt them to sign in...?


r/HTML 2h ago

A feature-complete PowerPoint clone written in a single HTML file, with collaborative editing

Thumbnail bento.page
2 Upvotes

Found it on HackerNews; currently top post rn


r/HTML 10h ago

Question How do you make an onclick that changes back to the original text when clicked again.

2 Upvotes

<html>

<body>

<p id="demo">File Number 1.</p>

<script>

document.getElementById("demo").addEventListener("click", myFunction);

function myFunction() {

document.getElementById("demo").innerHTML = "censored file information here";

}

</script>

</body>

</html>

Im using this code to make it so that when I click on "File Number 1", it shows the file information. It works, however, I want it to be so that when you click on the file information, it returns to just saying "file number 1", and you can do that infinitely. How would I do this? thanks


r/HTML 2d ago

I made 100% pure HTML website

Post image
282 Upvotes

I recently finished a ~6 month course on web development. JavaScript, TypeScript, CSS, Maven and other modern horrors influenced me to rebel again today's often bloated approach of developing websites and aplications.

"Developer" became a dirty word for me. The thinking (or should I say lack if thinking?) that everywhere is fast internet and infinite amount of computing resources tickles my mind in a uncomfortable way.

Sure, computers are fast, packets travel across the underwater optic cables nearly at the speed of light but it looks to me that a lot of web and software development is allowing bad practices and sloppy code because "just throw more resources at it".

I don't want to be a developer, I wish to become a programmer.

Thus, I made 100% pure HTML website to document my journey into the embedded systems and low level programming (and maybe a few more things along those lines).

It's may not be perfect, it may not follow the best of the best practices but I will get there as I go.


r/HTML 1d ago

Question Why do I struggle with this?

0 Upvotes

So whenever I code, I think of the code and I just can’t write it fast.. I code slower than an AI at 0mbps!

Can anyone help me troubleshoot this?


r/HTML 2d ago

Built my first HTML/CSS project. Looking for feedback!

Thumbnail
gallery
18 Upvotes

Hey everyone!

I recently started learning HTML and CSS, and this is the first project i created; I've been following Kevin Powell's begginers course, and I learned a lot along the way ! I will appriciate any feedbacks on my webpage and my code.
I'm planning to start learning javascript next while counting to improve in CSS and HTML.

Live site: https://wildfireanu.github.io/My-first-Webpage/

GitHub: https://github.com/WildfireAnu/My-first-Webpage

Thanks for checking it out!


r/HTML 2d ago

how do i remove this weird margin ????

3 Upvotes

--FIXED!!!! body margin was the problem...--

haihia....so i'm using a iframe that's supposed to be the size of the entire screen for it to work. but because of this margin it just looks weird....here's an image of how it looks

without the margin, the screen would be completely black

here's my code

<iframe src="" style="margin: 0px; border: 0px; background-color: black; width: 100vw; height: 100vh;"></iframe>

r/HTML 3d ago

Just a beginner rate my webpage be honest!

Post image
49 Upvotes

r/HTML 3d ago

Question html help

Post image
4 Upvotes

Hey! I only starting learning html two days ago and I'm struggling a bit with my neocities site.

Can someone please help me figure out where I am going wrong with my code? My site has one big 'box' down the middle where I have my content and the background is intended to be a separate colour.

However, I cannot get them to be separate colours for the life of me. (This is for the entire page so I'll try to cut down on the unnecessary bits)

This is the colour I am trying to make the bigger box - #8FBC8B

EDIT: It's fixed now, thanks! :D I had no idea a single hashtag could mess it up lolollll

CODE:

<html>

<head>

<title>ander's landing site</title> <style>

body {

background: url(https://neocities.org/site_thumbnails/39/09/anders113/water%20background-%20Imgur.jpg.210x158.webp);

background-repeat: repeat;

}

h1 {

color: #FFFFF0;

font-size: 50px;

text-align:center;

font-family:monospace,Georgia;

}

a {

color: mediumvioletred;

}

a:hover {

color: gold;}

body {

color: #8FBC8B;

max-width:800px;

margin: 0 auto;

padding: 0 20px;

.page {

background-color:#FAEBD7;

color:black;

border:4px solid RosyBrown;

border-radius: 12px;

padding: 15px;

margin: 40px 0;

box-shadow: 0 4px 8px rgba(0,0,0.2);

text-align: center;

}

.bigpage {

background-color:##8FBC8B;

color:black;

border:10px #7D4C13;

border-radius: 12px;

padding: 15px;

margin: 40px 0;

box-shadow: 0 4px 8px rgba(0,0,0.2);

text-align: center;

max-width:1000px;

}

#kirri {

text-align: left;}

h2 {

color: #12240C; }

</style>

</head>

<div class="bigpage"><body>

<h1 id="top">\&starf; anders aquarium \&starf;</h1> <br>

<div class="page"><h2><strong> WELCOME </strong><small>to the </small><strong> HOME </strong><small> page </small><strong>:)</strong></h2>

<iframe width="314" height="321" scrolling="no" src="https://gify.pet/pet/pet.html?name=Kirri <3&dob=1784269586&gender=f&element=Water&pet=https%3A%2F%2Fmedia3.giphy.com%2Fmedia%2Fv1.Y2lkPTc5MGI3NjExNGl5OHhoZGw5dG4wc3Uxd3I3c3lwdzluNnR1Nm12OTg3NGVoa3BzaSZlcD12MV9pbnRlcm5hbF9naWZfYnlfaWQmY3Q9Zw%2F2GmjfO9CtnVIaA8VFL%2Fgiphy.gif&map=https%3A%2F%2Fcdn.phototourl.com%2Ffree%2F2026-07-17-0f8e5d4f-a891-4c52-bc9e-bbf2601e8375.jpg&background=https%3A%2F%2Fcdn.phototourl.com%2Ffree%2F2026-07-17-0f8e5d4f-a891-4c52-bc9e-bbf2601e8375.jpg&tablecolor=white&textcolor=white" frameborder="0"></iframe>

<a href="[https://info.flagcounter.com/oOcf">](https://info.flagcounter.com/oOcf">)<img src="[https://s01.flagcounter.com/count/oOcf/bg\\_8F5E72/txt\\_EDBEDC/border\\_000000/columns\\_2/maxflags\\_10/viewers\\_0/labels\\_0/pageviews\\_0/flags\\_0/percent\\_1/](https://s01.flagcounter.com/count/oOcf/bg_8F5E72/txt_EDBEDC/border_000000/columns_2/maxflags_10/viewers_0/labels_0/pageviews_0/flags_0/percent_1/)" alt="Flag Counter" border="0" style="float:right;"></a>

<!-- I'm going to make a page just for kirri eventually...give her some virtual pets :D -->

<iframe src="https://shroom.ink/guard.html/?site=Ander's Aquarium&shroom=9" height="250px" width="200px" scrolling="no" style="float: right;" frameborder="0"></iframe>

<details id="kirri">

<summary><em>\&hearts;kirri\&hearts;</em></summary>

<p>This sweet girl is my darling, Kirri :) She lives in my bedroom and I have spent countless hours writing at my desk by her side. Her likeness is scattered throughout my home in many physical photos and colourful frames, and now she has populated a tiny space online as well!\&starf;</p>

</details> </div>

<!-- navigation -->

<div class="page"><fieldset><legend id="Navigation">Navigation:</legend><ul class="tree-view">

<li><a href="https://anders113.neocities.org/aboutme#poem" about.html title=":D"> about me</a></li>

<li><a href="https://anders113.neocities.org/resources"title="have fun and be home by 10!" coding resources.html> coding resources!! </a> </li>

<li><a href="https://anders113.neocities.org/formattingpractise" title="i know what u are"formatting practise.html> sapphic sunset hour </a> </li> </fieldset></div>

<div class="page"> <a href="https://www.chickensmoothie.com/pet/521020506.html"><img src="https://www.chickensmoothie.com/pet/521020506&bg=86bd75.jpg" border=0></a><br><b>Pet's name:</b> Willa <br> <a href="https://www.imood.com/[email protected]"><img src="https://moods.imood.com/display/[email protected]/fg-#B0C4D/bg-#DDA0D/imood.gif" alt="The current mood of [email protected] at www.imood.com" border="0"></a>

<p> this mossy and overgrown corner of the internet has been lovingly handcrafted </p>

<p> you can usually find me on <a href="https://archiveofourown.org/">ao3</a> and various other writing sites </p> </div>

<hr>

<!-- goodreads widget made accessible by the lovely petra pixel (linked on resources page) -->

<div class="page"> <hr>

<blockquote><h2>my favourite songs </h2></blockquote>

<ul>

<li> 'Cold Turkey' by The Happy Fits </li>

<li> 'Milk Carton' by Elio Mei </li>

<li> 'Twistin the Night Away' by Sam Cooke </li>

<li> 'Lost Kitten' by Metric </li>

</ul>

<hr>

<blockquote><h2> beloved places </h2></blockquote>

<a href="[https://anders113.neocities.org/bedroom">](https://anders113.neocities.org/bedroom">)<img style="float: right;" alt="pixel art door" src="[https://neocities.org/site\\_thumbnails/39/09/anders113/pixil-frame-0.png.210x158.webp](https://neocities.org/site_thumbnails/39/09/anders113/pixil-frame-0.png.210x158.webp)" /></a>

<ul>

<li> my desk </li>

<li> triplet falls </li>

<li> next to my cat by a sunny window </li>

</ul>

<p><a href="#top" title="only bc u asked nicely">take me back up please! :O</a> </p> </div>

</div>

</body>

</html>


r/HTML 4d ago

my first page ever

Thumbnail
gallery
35 Upvotes

i watched a 40 minutes tutorial last week about HTML, being a person who is considered the most stupid and unintelligent person when it comes to programming, and now, after a week (i was too busy bedrotting and binge watching movies to do it then) i decided to make my first page, it isn't perfect, my design lacks creativity, and my code is unorganized and mostly wrong, and i kept looking at my notebook because i didn't remember everything, it's not great, but i think it's decent for a start


r/HTML 4d ago

Article Customize any website with Njectify

0 Upvotes

Hey everyone!

I'd like to share a project I've been working on: Njectify.

It's a browser extension that lets you inject CSS and JavaScript into any website, making it easy to prototype UI changes, test styles, and experiment without modifying the original source code.

Some of the features include:

• Live CSS editing with an intuitive editor.
• Instant visual changes on any website.
• Automatic export of your CSS to Tailwind CSS utility classes.
• JavaScript injection for quick scripting and automation.
• Several additional tools designed to speed up front-end development.
• Persist even after reload page ( F5 )

The extension has already surpassed 5,000 users on the Chrome Web Store, and I thought it might be useful for developers in this community.

I'll leave a detailed article in the comments explaining the main features, use cases, and the extension itself.

I'd really appreciate any feedback, feature suggestions, or criticism. Thankssss!

detailed post.


r/HTML 4d ago

Highlighting searched words on Tumblr

1 Upvotes

Hi ! So I've made a Tumblr to be able to have my typed up notes for a DnD campaign on a theme of my choosing. But the issue is I would like to add a way to highlight the exact words I'm looking for in the search bar, not have the whole post pull up only.
I've only edited Tumblr themes when I was a teen, and had a web class in art school so I'm a beginner and this specific request has got me a bit lost I would appreciate any help
Thank you !


r/HTML 4d ago

Question css-gradients not working as expected

2 Upvotes

```css

body {

min-block-size: 100svh;

background: repeating-linear-gradient(#A4AAB1 2px , red 2px 15px);

}

```

this is all red how to fix ? what exactly here i am doing wrong and css is the most confusing and i feels like its more harder than python and any other programming language


r/HTML 3d ago

Question Could someone help me out with making a port of adobe flash professional in web browser as well as make it usable on mobile devices

0 Upvotes

I am trying to make a port of macromedia flash professional "the animation software" and I don't know where to start


r/HTML 5d ago

Question HELP I HAVE A JOB INTERVIEW

Post image
39 Upvotes

UPDATE: I made it past the technical round! PHEW 😮‍💨. The interviewer said all the candidates were on the struggle bus so it wasn’t just me lol!

I’ve been working in email marketing building emails using Pardot, Hubspot, etc etc, Pardot for the last 8 years. I can make edits to existing HTML but cannot build from scratch. If I do make edits I use Dreamweaver or AI.

I have an interview Monday for a live HTML session with the company’s like expert email HTML guy. HALP! WHERE CAN I LEARN TO DO THIS STUFF QUICKLY?? OR CAN SOMEONE EXPLAIN IT???!!

Edit: THIS INTERVIEW IS ON MONDAY 7/20 BTW


r/HTML 4d ago

My own language

0 Upvotes

I made my own programming language inspired from html called htd (hypertext markup drink) used to make custom drinks.


r/HTML 5d ago

Portifólio

5 Upvotes

Tô criando um portifólio pra trabalhar como freelancer já tenho uns projetos fictício simples, mais tô sem ideia de como fazer.


r/HTML 5d ago

Help moving Iframe

2 Upvotes

I put in a calander Iframe (image is somewhere here) and it WAS in a good position but after i inserted the title and positioned it. That moved it down and Nothing I do moves it up. I positioned the text and i like where it sits in relation to the calender I just need to move it all up, unsure how though.

code -

.Calander-Title{
  font-family: Curly;
  font-weight: bolder;
  color: #30291e;
  font-size: 50px;
  display: flex;
  justify-content: center;
  align-items: center;
  position: relative;
  top: 100px;
  right: 200px
}
.calendar{
  position:absolute;
  top:100px;
  left:100px;
}

r/HTML 6d ago

Question Website Visit Counter

6 Upvotes

Hello, so I want to make a visit counter for my website. For example if people get redirected by ChatGPT to a website, it adds an utm-source to the end of the link. I want to count how many and with which utm-source ​people connected with and normal visits should count too. (For GitHub Pages)


r/HTML 6d ago

Question Image Unblur

4 Upvotes

So always when I place an image in my HTML, like a 16 times 16 big image (For example an apple in Minecraft), it always makes the image blurred, annoyingly mixing the pixels together. Is there a way to block that?


r/HTML 7d ago

Question Left-brain looking for right-brain 😅

8 Upvotes

My ultimate dream is to meet someone who wants to code a retro style top down game (like original Zelda, game boy POKeMON games, secret of evermore, etc..) but isn’t good at creating artwork or story 😂

I have ALWAYS wanted to write a story, design a game, design characters, create the artwork, etc.. and have someone else code it. In fact I’m already sitting on a stack of concepts ready to go..

It’s a very specific dream.. but I thought I’d take my chances lol

I am a photoshop wizard and I make a lot of retro game art like 8 bit characters and maps and I’ve been called a gifted writer and original and all that. But my curse is I’m SO left-brained that I just can’t wrap my head around coding. Been trying all my life. I’m slightly dyslexic too so 🤷🏻‍♂️ could be why.

I used to do basic html as a kid so I get the basics but I can’t code a game.

I’m just trying any outlet I can think of to make my dream project a reality.

ANY TAKERS? 😅


r/HTML 7d ago

Designed a modular editor UI that runs entirely in the browser. What do you think of the HTML layout and the Dark vs Light theme toggle?

Thumbnail
gallery
4 Upvotes

r/HTML 7d ago

Question Where from i learn html as a complete beginner ?

7 Upvotes

Suggest me !


r/HTML 7d ago

Integration von videochat in html

0 Upvotes

Bin aktuell dabei eine telemedlösung für mich zu bauen für die Anwendung in unsrer Ordination. Prinzipiell haben wir schon eine Art Box angefertigt mit einem Touch Computer und webcam. Das ganze läuft bisher über frontends in form von html homepages (mehrere für patienten und für ärzte) die führung eines patientenstamms registrierung beschreibung des aktuellen problems usw datenbankbasiert läuft bereits erfolgreich und die abfragen funken. Nun gehts darum den letzten step, die video konsultation zu integrieren in html.
Daher suche ich eine fixfertige anwendung möglichst kostenlos mit der sich das umsetzen lässt.

Anforderungen:
-direkter einstieg ohne bestätigung am frontend patient in den videochat wenn der aptient vom arzt virtuell vom warteraum in den videochat geholt wird.
-warteraummöglichkeit als Lobby
- keine notwendigkeit von namenseingabe beim videochat da diese schon davor erhoben werden

Ich möcht es möglichst ohne eigenen server auf dem der sprachchat läuft umsetzen.

Jitsi
Whereby
Und daily haben nicht gefunkt immer kams zur abfrage der freigabe oder namenseingabe

Fällt jemanden noch was ein?
Bitte um Hilfe!!

Bin eher ein newcomer was html und programmieren betrifft.

Danke für eure hilfe


r/HTML 7d ago

Discussion I suffer

0 Upvotes

I spent an hour just trying to figure out how github functions and I have like two words on my future art portfolio website to show for it 😭 it's 2 am and I'm tired. Can't wait to finish and flex that I coded almost completely from scratch for my own portfolio instead of using canva or squarespace or whatever lol