[a / b / c / d / e / f / g / gif / h / hr / k / m / o / p / r / s / t / u / v / vg / vr / w / wg] [i / ic] [r9k / s4s / vip / qa] [cm / hm / lgbt / y] [3 / aco / adv / an / asp / bant / biz / cgl / ck / co / diy / fa / fit / gd / hc / his / int / jp / lit / mlp / mu / n / news / out / po / pol / qst / sci / soc / sp / tg / toy / trv / tv / vp / wsg / wsr / x] [Settings] [Search] [Home]
Settings Home
/wg/ - Wallpapers/General

4chan Pass users can bypass this verification. [Learn More] [Login]
  • Please read the Rules and FAQ before posting.
  • Maximum file size allowed is 6144 KB.
  • Images smaller than 480x600 pixels are not allowed.
  • There are 48 posters in this thread.

05/04/17New trial board added: /bant/ - International/Random
10/04/16New board for 4chan Pass users: /vip/ - Very Important Posts
06/20/16New 4chan Banner Contest with a chance to win a 4chan Pass! See the contest page for details.
[Hide] [Show All]

File: 1550821522844.webm (2.37 MB, 1359x901)
2.37 MB
2.37 MB WEBM
Just in time edition.

>What are startpages?
Startpages (in the context of this thread) are locally hosted webpages (as in, the files are on your computer - not a server somewhere) that serve as the homepage or new tab page for a browser. They generally contain some number of links to frequently visited sites as the main element; search bars, clocks, calendars and other embedded items are usually added as secondary elements.

>What browser are you using?
If you can't tell what browser it is, it's probably Firefox, you can theme Firefox using Stylish and finding themes on the Firefox tag of Userstyles.
Otherwise if you won't upgrade there's always Chrome, you can ~slightly~ customize it using Chrome Theme Maker. Lately, we noticed Vivaldi can can have custom css too.


---Discord link---

---Relevant Sites---
Collection of startpages for modification and use.

--HTML, CSS & JS--

---Colours Related Links---

---Colours Converter---


---Typography Related Links---

---Old Thread---
File: vrj.png (412 KB, 1114x602)
412 KB
412 KB PNG
startpage: https://rice.capuno.cat/Archive/NotRice/websites/startpages/gate/index.html
what do u guys think about the dvd effect when u click the viagra link? anyone has a better idea on how to do that?
New thread, even more spam.
This are the thing i've done:
Rate my newtab
if you are going for the box that everyone hopes hits perfectly in the corner, i really want to see the progression of this idea
my nigga
hey i recognise that webm
File: browser-2019-06-02.webm (1.29 MB, 1790x1111)
1.29 MB
1.29 MB WEBM
slight bump with an update on something i've been working on

also included the stylus code, look how clean it all looks
Looks dope, keep it up!
Are you on a small screen? Otherwise I'd pop a max width on that bad boy and generally provide a bit more space.

Depending on the background your thin font for the links might be a tad bit hard to read.

Personal nitpick: The lack of a consistent pairing of font types is a little off-putting. The time to me is paired with the month (mayo) even though it ought not to be. The temperature is paired with the date (30). This can also be solved with colors/font-weight.

I like the page, especially the wallpaper :)
In general: Page looking really good. The concept is there and you are doing well.

dvd effect: Personally its gimmicky and I doubt I'd use it (or anyone that uses this page). The issue is that you have to click that link, a new tab page ideally lasts as long as a single click, since it should be a minimal middleman between you and your new tab destination.

_Maybe_ have it do the effect after a variable amount of time without any action?
is there any way to hide the black line thats at the bottom of the tab bar?

how do you modify firefox ?

using css ?
Search the userChrome.css file, on gnu/linux: ~/.mozilla/firefox/profile.default/chrome/userChrome.css
There are also other tools inside firefox to view the classes and ids and shit from the browser itself and not the website, https://developer.mozilla.org/en-US/docs/Tools/Browser_Toolbox
U can try this userChrome.css https://rice.capuno.cat/Dotfiles/.mozilla/firefox/user/chrome/userChrome.css and edit it as u want if u dont want to fiddle with the browser toolbox.
Page 10. Wew.
File: hackybar.png (20 KB, 1833x1051)
20 KB
been a while but it's probably
#navigator-toolbox::after {
content: "";
display: -moz-box;
border-bottom: 1px solid var(--toolbox-border-bottom-color);
this shit (yet again).

or just make a hacky toggle solution that persists after deletion for some reason and made troubleshooting this complete aids
forgot i posted that

:root {
--chrome-content-separator-color: none !important;


border-bottom: 0px transparent !important;

did the trick
File: screencap.png (1016 KB, 1366x768)
1016 KB
1016 KB PNG
Does anybody know how to force Firefox to use Helvetica instead of reverting to Arial on custom start pages? some forums have suggested using
@font-face { font-family: 'font you want to replace'; src: local('font of your choice');
as a solution, but it doesn't seem to work. It must be a Firefox issue, as MS Edge can display the font with no problems.

I would also like to try to improve the readability of the links by making the backround blurred, but filter: blur also blurs the links themselves - is there any way to do this apart from editing the background picture manually? Thanks in advance
>With the @font-face rule, web designers do not have to use one of the "web-safe" fonts anymore.
no one sane should have suggested that for anything.
>blur also blurs the links themselves
blur the image and not the entire page?
Does a dark CSS for the updated E-Hentai layout exist?
well I want to blur the background of the links and keep the rest clear if that makes sense.
the way I'd salvage it is just boxing the entire thing in and making it a solid colour with alpha channel. least painful.

the way I thought of to get exactly what you described involves sprites and I'll leave it at that because it's completely retarded.
File: screencap1.png (590 KB, 1366x768)
590 KB
590 KB PNG
this is the css before, and the box elements are still there, i just removed the opacity in order to make it look transparent.
i had some problems doing it, when i removed the opacity of the box the text went with it, and i learned that this is because the child elements (eg the text) take the opacity values from the parent elements (box).
However I solved this by using rgba background values. The question is whether the blur effects can be ascribed to the box itself while not affecting the text.
File: DybUDbZWwAA_SWI.jpg (94 KB, 723x930)
94 KB
I'm not sure if this is the appropriate thread, but I've been trying Vivaldi for a bit and holy shit the font rendering is horrible - is there any fix? Picture unrelated.
way cleaner than my original thoughts. hope you like grid. (can probably just be ported to however yours is with z-index stuff. might even be better depending how you want to handle the image)

For Firefox when you start a new tab it doesn't let you start it with your homepage, is there an extension or a workaround for that?
New Tab Override - not the plus version though
many thanks for the advice, but for now it looks like too much work tweaking it up - I might go back to the project once I find more time but for now i'll just keep the semi-opaque box. I'll keep your code though hoping to make it happen one day.
updated for just regular divs and absolute positions and what not.

tldr blurred image needs to be seperate. like. if you got one box and one box only then you just make two boxes. image and blur in one and text in the other. z-index if needed.

no real work. it's like one very tiny line of markup.
File: Capturar.png (25 KB, 2560x1050)
25 KB
File: Start.png (207 KB, 1676x926)
207 KB
207 KB PNG
I've got this raw startpage I want to improve.
Please feel free to change, add, and remove any part.
Is there a download link to this css? Looks kinda neat.
I'll be radically honest with you, it's awful, start again with another style in mind.
Using a wallpaper for a website background might not be the cleanest idea.
File: preview.png (198 KB, 1676x920)
198 KB
198 KB PNG
I'm making little steps
Definitely swipe a search script from someone so you don't have five input fields.
File: 3.png (628 KB, 1366x653)
628 KB
628 KB PNG
hey thank you so much, would have never figured this out! appreciate it
File: 044623.png (3.67 MB, 1916x1045)
3.67 MB
3.67 MB PNG
Any idea on how to add a task list to a startpage?
But somehow I fucked things up with the layout..
Maybe some CSS is being applied inside the script?
File: 6356931473845.png (386 KB, 1366x768)
386 KB
386 KB PNG
i wrote up this rss reader for a jquery terminal that also searches unrecognized commands on bing, source included in contact, happy hacking
File: Preview.png (126 KB, 1364x672)
126 KB
126 KB PNG
I finished it. I only have a question and I hope someone can help me because I don't know how to figure it out.
I have 2 different size monitors and I need all elements to fit the with same proportions.
I settled out with crazy settings in the way to have the desired layout at 100% and 125% of my Chrome frame.
There should be a cleaner way to automate that playing with absolute/relative position, I give up!
Check it if you want.>>7428068
File: startup01.png (2.71 MB, 1920x1011)
2.71 MB
2.71 MB PNG
First I ever made
That's pretty nice, I think it would be cool if you made the links window a tabbed one, so you could have different subjects in different tabs.
It looks beautiful though, nice work.
hex of the background color please?
you could just copy/paste the picture in gimp and select it yourself
anyone got that pape?
File: 1539901795882.jpg (2.81 MB, 2560x1440)
2.81 MB
2.81 MB JPG
good ideam looks awesome im ur biggest fan now but obviously ur gonna need left-right movement too
i'll give you a hint... append localstorage['todo-items']
File: 1557842648933.jpg (1.08 MB, 5184x3456)
1.08 MB
1.08 MB JPG
What css is that
click the button more times, the direction is random

i am working on a "ss21/ss16 2.1.0" release but it's a slow process due to work
holy shit, i'll get back to you on that, once i figure it out
File: file.png (1.88 MB, 1920x1080)
1.88 MB
1.88 MB PNG
haven't really posted in a long time. i needa update the list as well :/
this is how it ended up looking like
mind posting the background image?
>Huffington Post
File: 1.png (294 KB, 1279x709)
294 KB
294 KB PNG
summer is here edition!
wanna play some chess, anon?
Im down, but mind you im not great. i mosly play long matches, if thats ok then lets do it
>but mind you im not great
don't worry, mate
i'm still in the phase of learning, invite me: temp199
sorry, username is of lichess
File: First Startpage.png (3.86 MB, 1920x957)
3.86 MB
3.86 MB PNG
First startpage I've made. Pretty simplistic but I like it. Any suggestions as to what I should add?
is codeacademy actually good?
Saw the wallpaper over in the cyberpunk thread and that window just screamed startpage.
Heavy work in process, but I like it so far. 3D perspective in CSS is a royal pain though.
File: wip.png (3.3 MB, 1914x937)
3.3 MB
3.3 MB PNG
I thought you guys might like this:

Same question here
I need a little bit of help.
I'm trying to make a collage of CSS stylesheets for Firefox but I'm having an issue with my tabs bar, and I don't know what is causing it. Help?
https://streamable .com/irf1f
https://paste .ee/p/PCg0G
>what is causing it
1. blindly pasting stuff
2. spastic hovers for no reason
3. transition: opacity 0.15s ease-in, max-height 0.15s linear;
4. transition: opacity 0.15s ease-in !important;
5. not clarifying which part you deem an issue
It's also a painfully bloated. 97 lines for something that takes 15 in reality (or less. mine is probably bloat as well because I'm a dummy)
File: screenshot.png (98 KB, 1360x738)
98 KB
>transition: opacity 0.15s
Removed them both and that seemingly solved most of the issue.

>not clarifying which part you deem an issue
The website overlapping with the tab bar. I thought that was obvious enough, I showed it thrice.

Right now, the only thing left to figure out is why is there this chunk of transparent space and a gray line right under the tabs bar.
I think it might have something to do with the tabs dimensions...? I don't know how to fix it though.
I'm gonna try things at random until someone who knows about this stuff can give me a bit of help.
I don't know a thing about this, but I think that things like auto-hide.css have different options set for the themes and density settings that Firefox has.
Certain dimensions for the Compact Mode with a Dark Theme and so on?
Not sure though, I know nothing about this. I just wanted a quick stylesheet with hoverable navbar and bookmarks bar desu with you.
Alright, that didn't take long.
Here it is. It might be painfully bloated, but hey, at least it works. If someone wanted to clean it up and share it, that would be cool, but the current result is good enough for me.
https://paste .ee/p/xift9
gray lines goes away with
#navigator-toolbox::after {
border-bottom: 0px;
probably. it's usually that.

I stand firm on the fact that writing 80 extra lines of dumb code instead of a single comment that instructs the user to change a single value if they aren't running default sizes is very silly. If nothing else the readability is absolutely awful.

(if it was cleaner you could maybe have spotted it yourself even if you're completely new)

Delete Post: [File Only] Style:
[Disable Mobile View / Use Desktop Site]

[Enable Mobile View / Use Mobile Site]

All trademarks and copyrights on this page are owned by their respective parties. Images uploaded are the responsibility of the Poster. Comments are owned by the Poster.