A downloadable template

About


CC-LINK is a website template that's free to use.

It's based on my website's design, which is itself inspired by 70s computer interfaces, and the name is inspired by LM-LINK and SEVASTOLINK, the terminal systems in Alien: Isolation.

CC-LINK is entirely made in HTML and CSS. Its code is extensively commented and should be easy to figure out even for complete beginners.

Latest version: v1.2 — November 2024

→ See CC-LINK's webpage


Features & Documentation

  • Fully responsive, mobile-friendly design that looks good and comfortable on all devices
  • Easily customisable colours, fonts, background images, and layout using CSS variables
  • Elegant paragraph/image layouts
  • ‘Preview frame’ for linking subpages or other 'fancy’ links
  • Simple image grids
  • Different types of lists: arrow lists, to-do lists…
  • 2 base themes for different flavours of the template

You can see live examples of all features and how to use them in the documentation/manual: 

→ MANUAL


Variations

CC-LINK

CC LINK is the default template design. Simple and utilitarian.

Download the zip file named "cc-link-[version].zip" to use this variation.

CC-SOFT

CC-SOFT is a "soft" version of the template with rounded corners.

Download the zip file named "cc-soft-[version].zip" to use this variation.


Other Links

→ FAQ / Frequently Asked Questions

→ Snippets / Extra code and Colour Palettes


Feedback

Please let me know if you end up using the template, or if you run into any problems with it, or if you have any feedback! 

You can send me an email, or leave a comment below.

Updated 22 days ago
StatusReleased
CategoryOther
Authorcc
Tagscss, html, neocities, Project template, website

Download

Download
cc-link-v1.2.zip 364 kB
Download
cc-soft-v1.2.zip 364 kB

Development log

Comments

Log in with itch.io to leave a comment.

(1 edit) (+1)

using it and loving it but I have a question - how can I include images in the main section without them becoming stretched out? my buttons are becoming massive unless I stick them in the widget corner


sorry if there's an obvious answer, I'm not great with coding. ty for the code!

(2 edits)

hi saltuarium, so sorry for not seeing this comment until now!

you can change the way images in the main section by looking for the bit in your style.css file that says:

section img {
	width: 100%;
}

and change it to:

section img {
	width: auto;
}

alternatively, if you only want to make specific images to not stretch out, you can add style="width: auto;" to the tag for the images in question. if they are 88x31px buttons though you could also set it to style="width: 88px; height: 31px;" which… i think should work too?

i should actually add my button gallery styles to the template maybe… hmm

good luck with the coding and let me know if you need me to clarify anything!