{"id":8153,"date":"2026-09-02T21:34:37","date_gmt":"2026-09-02T21:34:37","guid":{"rendered":"https:\/\/kutia.net\/setting-up-dark-mode-with-tailwind-2\/"},"modified":"2026-09-02T21:34:37","modified_gmt":"2026-09-02T21:34:37","slug":"setting-up-dark-mode-with-tailwind","status":"publish","type":"post","link":"https:\/\/kutia.net\/sv\/setting-up-dark-mode-with-tailwind\/","title":{"rendered":"St\u00e4ller in m\u00f6rkt l\u00e4ge med medvind"},"content":{"rendered":"<p class=\"wp-block-paragraph\">The dark mode is a popular feature in websites and apps because it provides several benefits to users. Some of the main reasons why dark mode is a good feature include:<\/p>\n<ul class=\"wp-block-list\">\n<li>Improved readability: Dark mode can make text and other elements on a website more legible and easier to read, especially in low-light environments. This can be especially beneficial for users with visual impairments.<\/li>\n<\/ul>\n<ul class=\"wp-block-list\">\n<li>Reduced eye strain: Prolonged exposure to bright screens can cause eye strain and fatigue. Dark mode can help reduce the amount of blue light emitted by screens, making it easier for the eyes for users to read or work for longer periods of time.<\/li>\n<\/ul>\n<ul class=\"wp-block-list\">\n<li>Increased battery life: Dark mode can help conserve energy and increase the battery life of devices, especially those with OLED or AMOLED screens. Since the pixels in these screens don&#8217;t need to produce as much light to display dark colors, using dark mode can significantly reduce power consumption.<\/li>\n<\/ul>\n<ul class=\"wp-block-list\">\n<li>Personalization: Many people prefer the aesthetic of dark mode and find it more visually appealing. Allowing users to switch to dark mode can provide a more personalized and enjoyable experience.<\/li>\n<\/ul>\n<ul class=\"wp-block-list\">\n<li>Accessibility: Dark mode is also useful for people with visual impairments and can make it easier to read and use websites and applications.<\/li>\n<\/ul>\n<ul class=\"wp-block-list\">\n<li>Branding: Dark mode can be used as a branding element, some specific niches like music, game, and programming have a preference for dark mode, and it can be used as a way to stand out and create a unique and memorable user experience.<\/li>\n<\/ul>\n<p class=\"wp-block-paragraph\">Overall, dark mode is a good feature in websites as it offers users a variety of benefits, including improved readability, reduced eye strain, increased battery life, personalization, and accessibility.<\/p>\n<p class=\"wp-block-paragraph\">How to set it up:<br \/>1. Add the following code to the&nbsp;tailwind.config.js<\/p>\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"832\" height=\"666\" src=\"https:\/\/kutia.net\/wp-content\/uploads\/2023\/01\/MicrosoftTeams-image-72.png\" alt=\"\" class=\"wp-image-4536\" srcset=\"https:\/\/kutia.net\/wp-content\/uploads\/2023\/01\/MicrosoftTeams-image-72.webp 832w, https:\/\/kutia.net\/wp-content\/uploads\/2023\/01\/MicrosoftTeams-image-72-300x240.webp 300w, https:\/\/kutia.net\/wp-content\/uploads\/2023\/01\/MicrosoftTeams-image-72-768x615.webp 768w\" sizes=\"auto, (max-width: 832px) 100vw, 832px\" \/><\/figure>\n<p class=\"wp-block-paragraph\">Setting&nbsp;<strong>darkMode: &#8216;class&#8217;&nbsp;w<\/strong>ill enable the generation of CSS class-based dark mode variants. This means that when you build your project with Tailwind, it will generate CSS classes for each utility class that has a&nbsp;<strong>.dark&nbsp;<\/strong>prefix. For example, if you have a utility class for setting text color to&nbsp;<strong>text-gray-800&nbsp;<\/strong>, Tailwind will also generate a variant&nbsp;<strong>text-gray-800 dark:text-gray-100&nbsp;<\/strong>that you can use to set the text color to when the&nbsp;<strong>dark&nbsp;<\/strong>class is added to the element. (This is useful since we use Javascript to toggle dark mode).<\/p>\n<p class=\"wp-block-paragraph\">2. In your React component (or a ThemeProvider context), create a state variable&nbsp;<strong>darkMode&nbsp;<\/strong>to keep track of the current theme:<\/p>\n<figure class=\"wp-block-image size-large is-resized\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kutia.net\/wp-content\/uploads\/2023\/01\/MicrosoftTeams-image-73-1024x470.png\" alt=\"\" class=\"wp-image-4539\" width=\"838\" height=\"384\" srcset=\"https:\/\/kutia.net\/wp-content\/uploads\/2023\/01\/MicrosoftTeams-image-73-1024x470.webp 1024w, https:\/\/kutia.net\/wp-content\/uploads\/2023\/01\/MicrosoftTeams-image-73-300x138.webp 300w, https:\/\/kutia.net\/wp-content\/uploads\/2023\/01\/MicrosoftTeams-image-73-768x353.webp 768w, https:\/\/kutia.net\/wp-content\/uploads\/2023\/01\/MicrosoftTeams-image-73.webp 1176w\" sizes=\"auto, (max-width: 838px) 100vw, 838px\" \/><\/figure>\n<p class=\"wp-block-paragraph\">3. In your component&#8217;s&nbsp;<strong>componentDidMount&nbsp;<\/strong>lifecycle method, check the value of the&nbsp;<strong>darkMode&nbsp;<\/strong>state variable against the value stored in local storage, and set the state accordingly:<\/p>\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"656\" src=\"https:\/\/kutia.net\/wp-content\/uploads\/2023\/01\/MicrosoftTeams-image-76-1024x656.png\" alt=\"\" class=\"wp-image-4542\" srcset=\"https:\/\/kutia.net\/wp-content\/uploads\/2023\/01\/MicrosoftTeams-image-76-1024x656.webp 1024w, https:\/\/kutia.net\/wp-content\/uploads\/2023\/01\/MicrosoftTeams-image-76-300x192.webp 300w, https:\/\/kutia.net\/wp-content\/uploads\/2023\/01\/MicrosoftTeams-image-76-768x492.webp 768w, https:\/\/kutia.net\/wp-content\/uploads\/2023\/01\/MicrosoftTeams-image-76.webp 1302w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n<p class=\"wp-block-paragraph\">4. Create a function to toggle the theme by updating the&nbsp;<strong>darkMode&nbsp;<\/strong>state variable and storing the new value in local storage:<\/p>\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"472\" src=\"https:\/\/kutia.net\/wp-content\/uploads\/2023\/01\/MicrosoftTeams-image-75-1024x472.png\" alt=\"\" class=\"wp-image-4545\" srcset=\"https:\/\/kutia.net\/wp-content\/uploads\/2023\/01\/MicrosoftTeams-image-75-1024x472.webp 1024w, https:\/\/kutia.net\/wp-content\/uploads\/2023\/01\/MicrosoftTeams-image-75-300x138.webp 300w, https:\/\/kutia.net\/wp-content\/uploads\/2023\/01\/MicrosoftTeams-image-75-768x354.webp 768w, https:\/\/kutia.net\/wp-content\/uploads\/2023\/01\/MicrosoftTeams-image-75.webp 1446w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n<p class=\"wp-block-paragraph\">5. In your JSX, use the&nbsp;<strong>darkMode&nbsp;<\/strong>state variable to conditionally render a classname which will be used to apply the dark mode styles:<\/p>\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"656\" src=\"https:\/\/kutia.net\/wp-content\/uploads\/2023\/01\/MicrosoftTeams-image-77-1024x656.png\" alt=\"\" class=\"wp-image-4548\" srcset=\"https:\/\/kutia.net\/wp-content\/uploads\/2023\/01\/MicrosoftTeams-image-77-1024x656.webp 1024w, https:\/\/kutia.net\/wp-content\/uploads\/2023\/01\/MicrosoftTeams-image-77-300x192.webp 300w, https:\/\/kutia.net\/wp-content\/uploads\/2023\/01\/MicrosoftTeams-image-77-768x492.webp 768w, https:\/\/kutia.net\/wp-content\/uploads\/2023\/01\/MicrosoftTeams-image-77.webp 1302w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n<p class=\"wp-block-paragraph\">6. Create a button to toggle the theme and call the&nbsp;<strong>toggleDarkMode&nbsp;<\/strong>function on click:<\/p>\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"427\" src=\"https:\/\/kutia.net\/wp-content\/uploads\/2023\/01\/MicrosoftTeams-image-74-1024x427.png\" alt=\"\" class=\"wp-image-4551\" srcset=\"https:\/\/kutia.net\/wp-content\/uploads\/2023\/01\/MicrosoftTeams-image-74-1024x427.webp 1024w, https:\/\/kutia.net\/wp-content\/uploads\/2023\/01\/MicrosoftTeams-image-74-300x125.webp 300w, https:\/\/kutia.net\/wp-content\/uploads\/2023\/01\/MicrosoftTeams-image-74-768x321.webp 768w, https:\/\/kutia.net\/wp-content\/uploads\/2023\/01\/MicrosoftTeams-image-74-1536x641.webp 1536w, https:\/\/kutia.net\/wp-content\/uploads\/2023\/01\/MicrosoftTeams-image-74.webp 1696w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n<p class=\"wp-block-paragraph\">Now, when the component is first rendered, it will check the value stored in local storage to determine whether to render the&nbsp;<strong>dark&nbsp;<\/strong>class or not, and when the button is clicked, it will toggle the theme by updating the&nbsp;<strong>darkMode&nbsp;<\/strong>state variable and storing the new value in local storage.<\/p>\n<p class=\"wp-block-paragraph\">Usage example:<\/p>\n<figure class=\"wp-block-image size-large\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"626\" src=\"https:\/\/kutia.net\/wp-content\/uploads\/2023\/01\/MicrosoftTeams-image-78-1024x626.png\" alt=\"\" class=\"wp-image-4554\" srcset=\"https:\/\/kutia.net\/wp-content\/uploads\/2023\/01\/MicrosoftTeams-image-78-1024x626.webp 1024w, https:\/\/kutia.net\/wp-content\/uploads\/2023\/01\/MicrosoftTeams-image-78-300x183.webp 300w, https:\/\/kutia.net\/wp-content\/uploads\/2023\/01\/MicrosoftTeams-image-78-768x470.webp 768w, https:\/\/kutia.net\/wp-content\/uploads\/2023\/01\/MicrosoftTeams-image-78.webp 1158w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n<p class=\"wp-block-paragraph\">In conclusion, setting up dark mode with Tailwind CSS is a simple process that can provide a variety of benefits for your users. By following the steps outlined in this blog post, you can easily improve the readability, reduce eye strain, increase battery life, personalize the user experience, and make your website more accessible for all users. Implementing dark mode can also be a great branding tool and make your website stand out in specific niches. With Tailwind CSS, you can quickly and easily add dark mode to your website with minimal effort and provide a better experience for your users.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Det m\u00f6rka l\u00e4get \u00e4r en popul\u00e4r funktion p\u00e5 webbplatser och appar eftersom det ger flera f\u00f6rdelar f\u00f6r anv\u00e4ndarna. <\/p>\n","protected":false},"author":0,"featured_media":4563,"comment_status":"","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[50],"tags":[],"class_list":["post-8153","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-okategoriserad"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v28.1 - https:\/\/yoast.com\/product\/yoast-seo-wordpress\/ -->\n<title>Setting up dark mode with tailwind - Kutia<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/kutia.net\/setting-up-dark-mode-with-tailwind-2\/\" \/>\n<meta property=\"og:locale\" content=\"sv_SE\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Setting up dark mode with tailwind - Kutia\" \/>\n<meta property=\"og:description\" content=\"Det m\u00f6rka l\u00e4get \u00e4r en popul\u00e4r funktion p\u00e5 webbplatser och appar eftersom det ger flera f\u00f6rdelar f\u00f6r anv\u00e4ndarna.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/kutia.net\/setting-up-dark-mode-with-tailwind-2\/\" \/>\n<meta property=\"og:site_name\" content=\"Kutia\" \/>\n<meta property=\"article:published_time\" content=\"2026-09-02T21:34:37+00:00\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/kutia.net\\\/setting-up-dark-mode-with-tailwind-2\\\/#article\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/kutia.net\\\/setting-up-dark-mode-with-tailwind-2\\\/\"},\"author\":{\"name\":\"\",\"@id\":\"\"},\"headline\":\"St\u00e4ller in m\u00f6rkt l\u00e4ge med medvind\",\"datePublished\":\"2026-09-02T21:34:37+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/kutia.net\\\/setting-up-dark-mode-with-tailwind-2\\\/\"},\"wordCount\":6,\"publisher\":{\"@id\":\"https:\\\/\\\/kutia.net\\\/#organization\"},\"image\":{\"@id\":\"https:\\\/\\\/kutia.net\\\/setting-up-dark-mode-with-tailwind-2\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/kutia.net\\\/wp-content\\\/uploads\\\/2023\\\/01\\\/Blog-ReUpload.webp\",\"articleSection\":[\"Okategoriserad\"],\"inLanguage\":\"sv-SE\"},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/kutia.net\\\/setting-up-dark-mode-with-tailwind-2\\\/\",\"url\":\"https:\\\/\\\/kutia.net\\\/setting-up-dark-mode-with-tailwind-2\\\/\",\"name\":\"Setting up dark mode with tailwind - Kutia\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/kutia.net\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/kutia.net\\\/setting-up-dark-mode-with-tailwind-2\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/kutia.net\\\/setting-up-dark-mode-with-tailwind-2\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/kutia.net\\\/wp-content\\\/uploads\\\/2023\\\/01\\\/Blog-ReUpload.webp\",\"datePublished\":\"2026-09-02T21:34:37+00:00\",\"inLanguage\":\"sv-SE\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/kutia.net\\\/setting-up-dark-mode-with-tailwind-2\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"sv-SE\",\"@id\":\"https:\\\/\\\/kutia.net\\\/setting-up-dark-mode-with-tailwind-2\\\/#primaryimage\",\"url\":\"https:\\\/\\\/kutia.net\\\/wp-content\\\/uploads\\\/2023\\\/01\\\/Blog-ReUpload.webp\",\"contentUrl\":\"https:\\\/\\\/kutia.net\\\/wp-content\\\/uploads\\\/2023\\\/01\\\/Blog-ReUpload.webp\",\"width\":10000,\"height\":5250},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/kutia.net\\\/#website\",\"url\":\"https:\\\/\\\/kutia.net\\\/\",\"name\":\"Kutia\",\"description\":\"Custom software, team augmentation, IT recruitment\",\"publisher\":{\"@id\":\"https:\\\/\\\/kutia.net\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/kutia.net\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"sv-SE\"},{\"@type\":[\"Organization\",\"ProfessionalService\"],\"@id\":\"https:\\\/\\\/kutia.net\\\/#organization\",\"name\":\"Kutia\",\"url\":\"https:\\\/\\\/kutia.net\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"sv-SE\",\"@id\":\"https:\\\/\\\/kutia.net\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/kutia.net\\\/wp-content\\\/uploads\\\/2026\\\/09\\\/android-chrome-512x512-1.png\",\"contentUrl\":\"https:\\\/\\\/kutia.net\\\/wp-content\\\/uploads\\\/2026\\\/09\\\/android-chrome-512x512-1.png\",\"width\":512,\"height\":512,\"caption\":\"Kutia\"},\"image\":{\"@id\":\"https:\\\/\\\/kutia.net\\\/#\\\/schema\\\/logo\\\/image\\\/\"},\"alternateName\":\"Kutia Software Company\",\"description\":\"Kutia is a software development company founded in 2013 and headquartered in Pristina, Kosovo, that builds custom software, web and mobile applications and AI systems in production, and provides dedicated engineering teams to companies and public institutions in Europe and the United States.\",\"slogan\":\"We build the systems companies run on.\",\"foundingDate\":\"2013\",\"foundingLocation\":{\"@type\":\"Place\",\"name\":\"Pristina, Kosovo\"},\"address\":{\"@type\":\"PostalAddress\",\"streetAddress\":\"St. C, Sima Com Complex, Building B, No. 7\",\"addressLocality\":\"Pristina\",\"postalCode\":\"10000\",\"addressCountry\":\"XK\"},\"location\":[{\"@type\":\"Place\",\"name\":\"Kutia headquarters, Pristina\",\"address\":{\"@type\":\"PostalAddress\",\"streetAddress\":\"St. C, Sima Com Complex, Building B, No. 7\",\"addressLocality\":\"Pristina\",\"postalCode\":\"10000\",\"addressCountry\":\"XK\"}},{\"@type\":\"Place\",\"name\":\"Kutia Albania\",\"address\":{\"@type\":\"PostalAddress\",\"addressCountry\":\"AL\"}},{\"@type\":\"Place\",\"name\":\"Kutia USA\",\"address\":{\"@type\":\"PostalAddress\",\"addressCountry\":\"US\"}}],\"email\":\"sales@kutia.net\",\"contactPoint\":[{\"@type\":\"ContactPoint\",\"contactType\":\"sales\",\"email\":\"sales@kutia.net\",\"url\":\"https:\\\/\\\/kutia.net\\\/estimate-your-project\\\/\",\"availableLanguage\":\"English\"},{\"@type\":\"ContactPoint\",\"contactType\":\"careers\",\"email\":\"careers@kutia.net\",\"url\":\"https:\\\/\\\/kutia.net\\\/open-positions\\\/\"}],\"numberOfEmployees\":{\"@type\":\"QuantitativeValue\",\"minValue\":60},\"areaServed\":[{\"@type\":\"Place\",\"name\":\"Europe\"},{\"@type\":\"Country\",\"name\":\"United States\"}],\"knowsAbout\":[\"Custom software development\",\"Dedicated development teams\",\"AI in production\",\"Web application development\",\"Mobile application development\",\"E-commerce development\",\"UX\\\/UI design\",\"Cloud infrastructure on AWS\",\"DevOps\",\"Quality assurance\",\"Legacy modernisation\",\"Software for the public sector\",\"Healthcare software\",\"Fintech and payments software\",\"iGaming software\",\"Energy and utilities software\",\"React\",\"Node.js\",\"TypeScript\",\"PHP\",\"Laravel\",\"React Native\",\"Flutter\"],\"hasCertification\":[{\"@type\":\"Certification\",\"name\":\"ISO 9001\"},{\"@type\":\"Certification\",\"name\":\"ISO\\\/IEC 27001\"},{\"@type\":\"Certification\",\"name\":\"ISO\\\/IEC 20000\"}],\"award\":[\"Impact Stars laureate, Deloitte Technology Fast 50 Central Europe\",\"Most Supportive Business of the Year, TOKA\"],\"founder\":{\"@type\":\"Person\",\"name\":\"Arianit Fazliu\",\"jobTitle\":\"CEO\"},\"owns\":{\"@type\":\"SoftwareApplication\",\"@id\":\"https:\\\/\\\/kutia.net\\\/#sixops\",\"name\":\"sixops\",\"url\":\"https:\\\/\\\/sixops.ai\\\/\",\"applicationCategory\":\"BusinessApplication\",\"operatingSystem\":\"Web\",\"description\":\"sixops is the operating system for professional services: a professional services automation (PSA) platform that runs a services company as one system, from the proposal to the paid invoice, with the estimate and the actual side by side on every project.\",\"publisher\":{\"@id\":\"https:\\\/\\\/kutia.net\\\/#organization\"},\"creator\":{\"@id\":\"https:\\\/\\\/kutia.net\\\/#organization\"}},\"sameAs\":[\"https:\\\/\\\/www.linkedin.com\\\/company\\\/kutia\\\/\",\"https:\\\/\\\/clutch.co\\\/profile\\\/kutia-software-company\",\"https:\\\/\\\/themanifest.com\\\/company\\\/kutia-software-company\",\"https:\\\/\\\/techbehemoths.com\\\/company\\\/kutia-software-company\",\"https:\\\/\\\/www.crunchbase.com\\\/organization\\\/kutia\",\"https:\\\/\\\/github.com\\\/kutia-software-company\",\"https:\\\/\\\/www.facebook.com\\\/kutiasoftware\\\/\",\"https:\\\/\\\/x.com\\\/kutia_net\",\"https:\\\/\\\/www.instagram.com\\\/kutiadigitalagency\\\/\",\"https:\\\/\\\/stikk.org\\\/en\\\/members\\\/kutia-software-company\\\/\"]}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Setting up dark mode with tailwind - Kutia","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/kutia.net\/setting-up-dark-mode-with-tailwind-2\/","og_locale":"sv_SE","og_type":"article","og_title":"Setting up dark mode with tailwind - Kutia","og_description":"Det m\u00f6rka l\u00e4get \u00e4r en popul\u00e4r funktion p\u00e5 webbplatser och appar eftersom det ger flera f\u00f6rdelar f\u00f6r anv\u00e4ndarna.","og_url":"https:\/\/kutia.net\/setting-up-dark-mode-with-tailwind-2\/","og_site_name":"Kutia","article_published_time":"2026-09-02T21:34:37+00:00","twitter_card":"summary_large_image","schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/kutia.net\/setting-up-dark-mode-with-tailwind-2\/#article","isPartOf":{"@id":"https:\/\/kutia.net\/setting-up-dark-mode-with-tailwind-2\/"},"author":{"name":"","@id":""},"headline":"St\u00e4ller in m\u00f6rkt l\u00e4ge med medvind","datePublished":"2026-09-02T21:34:37+00:00","mainEntityOfPage":{"@id":"https:\/\/kutia.net\/setting-up-dark-mode-with-tailwind-2\/"},"wordCount":6,"publisher":{"@id":"https:\/\/kutia.net\/#organization"},"image":{"@id":"https:\/\/kutia.net\/setting-up-dark-mode-with-tailwind-2\/#primaryimage"},"thumbnailUrl":"https:\/\/kutia.net\/wp-content\/uploads\/2023\/01\/Blog-ReUpload.webp","articleSection":["Okategoriserad"],"inLanguage":"sv-SE"},{"@type":"WebPage","@id":"https:\/\/kutia.net\/setting-up-dark-mode-with-tailwind-2\/","url":"https:\/\/kutia.net\/setting-up-dark-mode-with-tailwind-2\/","name":"Setting up dark mode with tailwind - Kutia","isPartOf":{"@id":"https:\/\/kutia.net\/#website"},"primaryImageOfPage":{"@id":"https:\/\/kutia.net\/setting-up-dark-mode-with-tailwind-2\/#primaryimage"},"image":{"@id":"https:\/\/kutia.net\/setting-up-dark-mode-with-tailwind-2\/#primaryimage"},"thumbnailUrl":"https:\/\/kutia.net\/wp-content\/uploads\/2023\/01\/Blog-ReUpload.webp","datePublished":"2026-09-02T21:34:37+00:00","inLanguage":"sv-SE","potentialAction":[{"@type":"ReadAction","target":["https:\/\/kutia.net\/setting-up-dark-mode-with-tailwind-2\/"]}]},{"@type":"ImageObject","inLanguage":"sv-SE","@id":"https:\/\/kutia.net\/setting-up-dark-mode-with-tailwind-2\/#primaryimage","url":"https:\/\/kutia.net\/wp-content\/uploads\/2023\/01\/Blog-ReUpload.webp","contentUrl":"https:\/\/kutia.net\/wp-content\/uploads\/2023\/01\/Blog-ReUpload.webp","width":10000,"height":5250},{"@type":"WebSite","@id":"https:\/\/kutia.net\/#website","url":"https:\/\/kutia.net\/","name":"Kutia","description":"Custom software, team augmentation, IT recruitment","publisher":{"@id":"https:\/\/kutia.net\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/kutia.net\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"sv-SE"},{"@type":["Organization","ProfessionalService"],"@id":"https:\/\/kutia.net\/#organization","name":"Kutia","url":"https:\/\/kutia.net\/","logo":{"@type":"ImageObject","inLanguage":"sv-SE","@id":"https:\/\/kutia.net\/#\/schema\/logo\/image\/","url":"https:\/\/kutia.net\/wp-content\/uploads\/2026\/09\/android-chrome-512x512-1.png","contentUrl":"https:\/\/kutia.net\/wp-content\/uploads\/2026\/09\/android-chrome-512x512-1.png","width":512,"height":512,"caption":"Kutia"},"image":{"@id":"https:\/\/kutia.net\/#\/schema\/logo\/image\/"},"alternateName":"Kutia Software Company","description":"Kutia is a software development company founded in 2013 and headquartered in Pristina, Kosovo, that builds custom software, web and mobile applications and AI systems in production, and provides dedicated engineering teams to companies and public institutions in Europe and the United States.","slogan":"We build the systems companies run on.","foundingDate":"2013","foundingLocation":{"@type":"Place","name":"Pristina, Kosovo"},"address":{"@type":"PostalAddress","streetAddress":"St. C, Sima Com Complex, Building B, No. 7","addressLocality":"Pristina","postalCode":"10000","addressCountry":"XK"},"location":[{"@type":"Place","name":"Kutia headquarters, Pristina","address":{"@type":"PostalAddress","streetAddress":"St. C, Sima Com Complex, Building B, No. 7","addressLocality":"Pristina","postalCode":"10000","addressCountry":"XK"}},{"@type":"Place","name":"Kutia Albania","address":{"@type":"PostalAddress","addressCountry":"AL"}},{"@type":"Place","name":"Kutia USA","address":{"@type":"PostalAddress","addressCountry":"US"}}],"email":"sales@kutia.net","contactPoint":[{"@type":"ContactPoint","contactType":"sales","email":"sales@kutia.net","url":"https:\/\/kutia.net\/estimate-your-project\/","availableLanguage":"English"},{"@type":"ContactPoint","contactType":"careers","email":"careers@kutia.net","url":"https:\/\/kutia.net\/open-positions\/"}],"numberOfEmployees":{"@type":"QuantitativeValue","minValue":60},"areaServed":[{"@type":"Place","name":"Europe"},{"@type":"Country","name":"United States"}],"knowsAbout":["Custom software development","Dedicated development teams","AI in production","Web application development","Mobile application development","E-commerce development","UX\/UI design","Cloud infrastructure on AWS","DevOps","Quality assurance","Legacy modernisation","Software for the public sector","Healthcare software","Fintech and payments software","iGaming software","Energy and utilities software","React","Node.js","TypeScript","PHP","Laravel","React Native","Flutter"],"hasCertification":[{"@type":"Certification","name":"ISO 9001"},{"@type":"Certification","name":"ISO\/IEC 27001"},{"@type":"Certification","name":"ISO\/IEC 20000"}],"award":["Impact Stars laureate, Deloitte Technology Fast 50 Central Europe","Most Supportive Business of the Year, TOKA"],"founder":{"@type":"Person","name":"Arianit Fazliu","jobTitle":"CEO"},"owns":{"@type":"SoftwareApplication","@id":"https:\/\/kutia.net\/#sixops","name":"sixops","url":"https:\/\/sixops.ai\/","applicationCategory":"BusinessApplication","operatingSystem":"Web","description":"sixops is the operating system for professional services: a professional services automation (PSA) platform that runs a services company as one system, from the proposal to the paid invoice, with the estimate and the actual side by side on every project.","publisher":{"@id":"https:\/\/kutia.net\/#organization"},"creator":{"@id":"https:\/\/kutia.net\/#organization"}},"sameAs":["https:\/\/www.linkedin.com\/company\/kutia\/","https:\/\/clutch.co\/profile\/kutia-software-company","https:\/\/themanifest.com\/company\/kutia-software-company","https:\/\/techbehemoths.com\/company\/kutia-software-company","https:\/\/www.crunchbase.com\/organization\/kutia","https:\/\/github.com\/kutia-software-company","https:\/\/www.facebook.com\/kutiasoftware\/","https:\/\/x.com\/kutia_net","https:\/\/www.instagram.com\/kutiadigitalagency\/","https:\/\/stikk.org\/en\/members\/kutia-software-company\/"]}]}},"_links":{"self":[{"href":"https:\/\/kutia.net\/sv\/wp-json\/wp\/v2\/posts\/8153","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/kutia.net\/sv\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/kutia.net\/sv\/wp-json\/wp\/v2\/types\/post"}],"replies":[{"embeddable":true,"href":"https:\/\/kutia.net\/sv\/wp-json\/wp\/v2\/comments?post=8153"}],"version-history":[{"count":0,"href":"https:\/\/kutia.net\/sv\/wp-json\/wp\/v2\/posts\/8153\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/kutia.net\/sv\/wp-json\/wp\/v2\/media\/4563"}],"wp:attachment":[{"href":"https:\/\/kutia.net\/sv\/wp-json\/wp\/v2\/media?parent=8153"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/kutia.net\/sv\/wp-json\/wp\/v2\/categories?post=8153"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/kutia.net\/sv\/wp-json\/wp\/v2\/tags?post=8153"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}