---
title: "Flarum 검색창 아이콘 버튼 색상 수정 - 근심을 잊는 한 장"
description: "이 튜토리얼은 순전히 불필요한 내용입니다. 단지 개인적으로 색상을 조금 바꾸는 것이 더 보기 좋다고 생각했을 뿐입니다. 아무래도 무, 배추처럼 각자 취향이 다르니 원래 색상을 좋아하는 사람도 있겠지만, 그래도 기록해 둡니다. 혹시 저처럼 다른 색상으로 바꾸는 것을 좋아하는 사람이 있을지"
canonical_url: "https://www.ikxin.com/ko/article/flarum-search-icon-color"
last_updated: "2026-09-16T09:59:27.259Z"
locale: ko
meta:
  "og:description": "이 튜토리얼은 순전히 불필요한 내용입니다. 단지 개인적으로 색상을 조금 바꾸는 것이 더 보기 좋다고 생각했을 뿐입니다. 아무래도 무, 배추처럼 각자 취향이 다르니 원래 색상을 좋아하는 사람도 있겠지만, 그래도 기록해 둡니다. 혹시 저처럼 다른 색상으로 바꾸는 것을 좋아하는 사람이 있을지"
  "og:image": "https://www.ikxin.com/_og/d/h_630%2Ca_~RmxhcnVtIOqygOyDieywvSDslYTsnbTsvZgg67KE7Yq8IOyDieyDgSDsiJjsoJUgLSDqt7zsi6zsnYQg7J6K64qUIO2VnCDsnqU%2Cc_Article%2Ctitle_~RmxhcnVtIOqygOyDieywvSDslYTsnbTsvZgg67KE7Yq8IOyDieyDgSDsiJjsoJU%2Cdescription_~7J20IO2KnO2GoOumrOyWvOydgCDsiJzsoITtnogg67aI7ZWE7JqU7ZWcIOuCtOyaqeyeheuLiOuLpC4g64uo7KeAIOqwnOyduOyggeycvOuhnCDsg4nsg4HsnYQg7KGw6riIIOuwlOq-uOuKlCDqsoPsnbQg642UIOuztOq4sCDsoovri6Tqs6Ag7IOd6rCB7ZaI7J2EIOu~kOyeheuLiOuLpC4g7JWE66y0656Y64-EIOustCwg67Cw7LaU7LKY65-8IOqwgeyekCDst6jtlqXsnbQg64uk66W064uIIOybkOuemCDsg4nsg4HsnYQg7KKL7JWE7ZWY64qUIOyCrOuejOuPhCDsnojqsqDsp4Drp4wsIOq3uOuemOuPhCDquLDroZ3tlbQg65Gh64uI64ukLiDtmLnsi5wg7KCA7LKY65-8IOuLpOuluCDsg4nsg4HsnLzroZwg67CU6r6464qUIOqyg-ydhCDsoovslYTtlZjripQg7IKs656M7J20IOyeiOydhOyngA%2CsiteName_~6re87Ius7J2EIOyeiuuKlCDtlZwg7J6l%2CsiteHost_www.ikxin.com%2Cp_Ii9rby9hcnRpY2xlL2ZsYXJ1bS1zZWFyY2gtaWNvbi1jb2xvciI%2Cs_tOy6Byc5RaUnMCUF.png"
  "og:image:alt": "Flarum 검색창 아이콘 버튼 색상 수정 - 근심을 잊는 한 장"
  "og:image:height": "630"
  "og:image:type": image/png
  "og:image:width": "1200"
  "og:title": "Flarum 검색창 아이콘 버튼 색상 수정"
  "twitter:image": "https://www.ikxin.com/_og/d/h_630%2Ca_~RmxhcnVtIOqygOyDieywvSDslYTsnbTsvZgg67KE7Yq8IOyDieyDgSDsiJjsoJUgLSDqt7zsi6zsnYQg7J6K64qUIO2VnCDsnqU%2Cc_Article%2Ctitle_~RmxhcnVtIOqygOyDieywvSDslYTsnbTsvZgg67KE7Yq8IOyDieyDgSDsiJjsoJU%2Cdescription_~7J20IO2KnO2GoOumrOyWvOydgCDsiJzsoITtnogg67aI7ZWE7JqU7ZWcIOuCtOyaqeyeheuLiOuLpC4g64uo7KeAIOqwnOyduOyggeycvOuhnCDsg4nsg4HsnYQg7KGw6riIIOuwlOq-uOuKlCDqsoPsnbQg642UIOuztOq4sCDsoovri6Tqs6Ag7IOd6rCB7ZaI7J2EIOu~kOyeheuLiOuLpC4g7JWE66y0656Y64-EIOustCwg67Cw7LaU7LKY65-8IOqwgeyekCDst6jtlqXsnbQg64uk66W064uIIOybkOuemCDsg4nsg4HsnYQg7KKL7JWE7ZWY64qUIOyCrOuejOuPhCDsnojqsqDsp4Drp4wsIOq3uOuemOuPhCDquLDroZ3tlbQg65Gh64uI64ukLiDtmLnsi5wg7KCA7LKY65-8IOuLpOuluCDsg4nsg4HsnLzroZwg67CU6r6464qUIOqyg-ydhCDsoovslYTtlZjripQg7IKs656M7J20IOyeiOydhOyngA%2CsiteName_~6re87Ius7J2EIOyeiuuKlCDtlZwg7J6l%2CsiteHost_www.ikxin.com%2Cp_Ii9rby9hcnRpY2xlL2ZsYXJ1bS1zZWFyY2gtaWNvbi1jb2xvciI%2Cs_tOy6Byc5RaUnMCUF.png"
  "twitter:image:alt": "Flarum 검색창 아이콘 버튼 색상 수정 - 근심을 잊는 한 장"
---

> Index of every page on this site: [llms.txt](https://www.ikxin.com/llms.txt)

# **Flarum 검색창 아이콘 버튼 색상 수정**

2018.07.25 4,448  0

이 튜토리얼은 순전히 불필요한 내용입니다. 단지 개인적으로 색상을 조금 바꾸는 것이 더 보기 좋다고 생각했을 뿐입니다. 아무래도 무, 배추처럼 각자 취향이 다르니 원래 색상을 좋아하는 사람도 있겠지만, 그래도 기록해 둡니다. 혹시 저처럼 다른 색상으로 바꾸는 것을 좋아하는 사람이 있을지도 모르니까요. 먼저 이미지를 올립니다.

## 과정

먼저 검색창의 클래스명을 찾습니다. F12를 눌러 요소를 검사합니다.

`.Search-input:before` 클래스명을 확인한 다음 열어 봅니다.

 Less

```
/vendor/flarum/core/less/lib/Search.less
```

아래 그림과 같이 수정합니다. 왼쪽은 수정된 버전이고, 오른쪽은 원본 버전입니다.

다음 CSS로 수정해야 합니다.

 CSS

```
background: #2aaaff;
color: #fff;
border-radius: 4px 0 0 4px;
padding-left: 40px;
padding-right: 10px;
```

Background는 웹사이트 테마 색상과 동기화합니다.

 CSS

```
background: #2aaaff; 
改成
background: @primary-color;
```

## **댓글**

(0)

아직 댓글이 없습니다

## **댓글 작성**

```json
{"@context":"https://schema.org","@graph":[{"@id":"https://www.ikxin.com/ko#website","@type":"WebSite","description":"근심을 잊는 한 장은 기술 탐구와 일상을 다루는 개인 웹사이트입니다. 웹 개발, 백엔드 및 DevOps 실무를 기록하고 소프트웨어 도구와 디지털 경험, 코드 밖의 견문과 생각을 나눕니다.","inLanguage":"ko-KR","name":"근심을 잊는 한 장","url":"https://www.ikxin.com/ko","translationOfWork":{"@id":"https://www.ikxin.com/#website"}},{"@id":"https://www.ikxin.com/ko/article/flarum-search-icon-color#webpage","@type":"WebPage","description":"이 튜토리얼은 순전히 불필요한 내용입니다. 단지 개인적으로 색상을 조금 바꾸는 것이 더 보기 좋다고 생각했을 뿐입니다. 아무래도 무, 배추처럼 각자 취향이 다르니 원래 색상을 좋아하는 사람도 있겠지만, 그래도 기록해 둡니다. 혹시 저처럼 다른 색상으로 바꾸는 것을 좋아하는 사람이 있을지","name":"Flarum 검색창 아이콘 버튼 색상 수정","url":"https://www.ikxin.com/ko/article/flarum-search-icon-color","isPartOf":{"@id":"https://www.ikxin.com/ko#website"},"potentialAction":[{"@type":"ReadAction","target":["https://www.ikxin.com/ko/article/flarum-search-icon-color"]}]}]}
```

## Sitemap

See the full [sitemap](https://www.ikxin.com/sitemap.md) for all pages.