https://github.com/nusserstudios/tailbliss

TailBliss is a Hugo Starter theme built on TailwindCSS 3, and Alpine.JS.
https://github.com/nusserstudios/tailbliss

alpinejs hacktoberfest hugo hugo-blog-theme hugo-site hugo-theme image-processing tailwindcss tailwindcss-v3

Last synced: 5 days ago
JSON representation

TailBliss is a Hugo Starter theme built on TailwindCSS 3, and Alpine.JS.

• Host: GitHub
• URL: https://github.com/nusserstudios/tailbliss
• Owner: nusserstudios
• License: apache-2.0
• Created: 2022-10-28T22:19:46.000Z (over 2 years ago)
• Default Branch: main
• Last Pushed: 2025-01-13T19:31:43.000Z (17 days ago)
• Last Synced: 2025-01-18T15:05:56.436Z (12 days ago)
• Topics: alpinejs, hacktoberfest, hugo, hugo-blog-theme, hugo-site, hugo-theme, image-processing, tailwindcss, tailwindcss-v3
• Language: CSS
• Homepage: https://tailbliss.netlify.app/
• Size: 61 MB
• Stars: 337
• Watchers: 5
• Forks: 149
• Open Issues: 8
• Metadata Files:
  • Readme: README.md
  • License: LICENSE
  • Code of conduct: CODE_OF_CONDUCT.md

Awesome Lists containing this project

README

        


 

 
TailBliss

 
TailBliss is an opinionated Hugo Starter with Tailwind CSS 3.2 and Alpine.js with light/dark modes.


  


    

      

    

    

      

    

    

      

    

    

      

    

    


    


    

      

    

    

      

    

    

      

    

  


  


    View Demo

    ·

    Report Bug

    ·

    Request Feature

    ·

    Ask Question

  








**Install to VS Code with:**  

`git clone [email protected]:nusserstudios/tailbliss your-name`

##### Install with NPM 

`npm install`

##### Install with Yarn

`yarn`

**To start developing:**

##### Develop with NPM 

`npm run start`

##### Develop with Yarn

`yarn start`

**To generate the site HTML:**

##### Build with NPM 

`npm run build`

##### Build with Yarn

`yarn build`

**npm run start** will run two commands parallel:  

`npx tailwindcss -i ./assets/css/main.css -o ./assets/css/style.css --watch`

Has paginated Categories and Tags. Markdown files will automatically convert images put into `/assets` folder to .webp images. 

## Image shortcodes for webp as well.

{{< imgc src="img-name.jpg" alt="Place alt text here." >}}



## Form

To use the form, visit [FormSubmit.Co](https://formsubmit.co/). Locate the contact form in "content/contact.md", and update the form action with the email address you want on this line: **action="https://formsubmit.co/[email protected]" method="POST"**

## Credits

4044ever - Original Theme

https://github.com/4044ever/Hugo-Tailwind-3.0.git

Jan Heise - Alpine.js Navbar

https://github.com/jan-heise/responsive-navbar-with-dropdown

Made for Hacktoberfest, with ❤️ by NusserStudios.